/*
 * NobodyInJP reusable components.
 * Canonical source for shared header/search/cartbar/footer guide/button/form/pagination/drawer styling.
 * Keep page-only spacing in pages.css and legacy ECShop selector bridging in legacy-bridge.css.
 */

.ni-button,
a.ni-button,
button.ni-button,
input.ni-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 18px;
  border: 1px solid var(--ni-color-line);
  border-radius: var(--ni-radius-pill);
  background: linear-gradient(180deg, #fffdf9 0%, #f7eee7 100%);
  color: var(--ni-color-text);
  font-family: var(--ni-font-button, var(--ni-font-body));
  font-size: 14px;
  font-weight: var(--ni-button-font-weight, 700);
  letter-spacing: var(--ni-button-letter-spacing, .03em);
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  box-sizing: border-box;
}

.ni-card {
  border: 1px solid var(--ni-color-line);
  border-radius: var(--ni-radius-md);
  background: var(--ni-color-surface);
  box-shadow: var(--ni-shadow-soft);
}

.ni-breadcrumb-wrap,
.ni-global-breadcrumb-wrap {
  width: min(var(--ni-page-max, 960px), calc(100% - 56px));
  max-width: var(--ni-page-max, 960px);
  margin: 6px auto 6px;
  padding: 0;
  border: 0;
  border-bottom: 0;
  background: transparent;
  box-shadow: none;
  box-sizing: border-box;
}

.ni-breadcrumb,
.ni-soft-breadcrumb,
.ni-breadcrumb-wrap #ur_here,
.ni-global-breadcrumb-wrap #ur_here,
#ur_here.ni-breadcrumb,
#ur_here.ni-soft-breadcrumb {
  display: block;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ni-breadcrumb-text, #a48d83);
  font-family: var(--ni-font-body);
  font-size: 12px;
  line-height: 1.7;
  letter-spacing: .02em;
  box-sizing: border-box;
}

.ni-breadcrumb img,
.ni-soft-breadcrumb img,
.ni-breadcrumb-wrap #ur_here img,
.ni-global-breadcrumb-wrap #ur_here img {
  display: none;
}

.ni-breadcrumb a,
.ni-soft-breadcrumb a,
.ni-breadcrumb-wrap #ur_here a,
.ni-global-breadcrumb-wrap #ur_here a {
  color: var(--ni-breadcrumb-link, #a48d83);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .18s ease, border-color .18s ease;
}

.ni-breadcrumb a:hover,
.ni-soft-breadcrumb a:hover,
.ni-breadcrumb-wrap #ur_here a:hover,
.ni-global-breadcrumb-wrap #ur_here a:hover {
  color: var(--ni-breadcrumb-link-hover, #9b6463);
  border-bottom-color: rgba(155, 100, 99, .32);
}

.ni-breadcrumb-wrap #ur_here code,
.ni-global-breadcrumb-wrap #ur_here code,
#ur_here.ni-breadcrumb code,
#ur_here.ni-soft-breadcrumb code {
  margin: 0 .18em;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  -webkit-text-fill-color: currentColor;
  font: inherit;
  font-family: inherit;
  letter-spacing: inherit;
}

/* NI_BREADCRUMB_CANONICAL
 * Single site-wide breadcrumb owner. Legacy style.css #ur_here strips are excluded at source;
 * do not add page-local or late-load breadcrumb color overrides elsewhere.
 */
html body .ni-breadcrumb-wrap,
html body .ni-global-breadcrumb-wrap,
html body .ni-listing-shell > .ni-breadcrumb-wrap,
html body .ni-listing-shell > .ni-global-breadcrumb-wrap,
html body .ni-member-shell > .ni-breadcrumb-wrap,
html body .ni-member-shell > .ni-global-breadcrumb-wrap{
  margin-top:6px !important;
  margin-bottom:6px !important;
  padding:0 !important;
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  border:0 !important;
  border-bottom:0 !important;
  box-shadow:none !important;
}
html body #ur_here.ni-breadcrumb,
html body #ur_here.ni-soft-breadcrumb,
html body .ni-breadcrumb-wrap #ur_here,
html body .ni-global-breadcrumb-wrap #ur_here,
html body .ni-listing-shell > .ni-breadcrumb-wrap #ur_here,
html body .ni-listing-shell > .ni-global-breadcrumb-wrap #ur_here,
html body .ni-member-shell > .ni-breadcrumb-wrap #ur_here,
html body .ni-member-shell > .ni-global-breadcrumb-wrap #ur_here,
html body.ni-page-member .ni-breadcrumb-wrap #ur_here,
html body.ni-page-category .ni-breadcrumb-wrap #ur_here,
html body.ni-page-search .ni-breadcrumb-wrap #ur_here,
html body.ni-page-brand .ni-breadcrumb-wrap #ur_here{
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  border:0 !important;
  border-bottom:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  color:var(--ni-breadcrumb-text, #a48d83) !important;
  -webkit-text-fill-color:var(--ni-breadcrumb-text, #a48d83) !important;
  font-family:var(--ni-font-body) !important;
  font-size:12px !important;
  line-height:1.7 !important;
  letter-spacing:.02em !important;
}
html body .ni-breadcrumb-wrap #ur_here a,
html body .ni-global-breadcrumb-wrap #ur_here a,
html body .ni-listing-shell > .ni-breadcrumb-wrap #ur_here a,
html body .ni-listing-shell > .ni-global-breadcrumb-wrap #ur_here a,
html body .ni-member-shell > .ni-breadcrumb-wrap #ur_here a,
html body .ni-member-shell > .ni-global-breadcrumb-wrap #ur_here a,
html body.ni-page-member .ni-breadcrumb-wrap #ur_here a,
html body.ni-page-category .ni-breadcrumb-wrap #ur_here a,
html body.ni-page-search .ni-breadcrumb-wrap #ur_here a,
html body.ni-page-brand .ni-breadcrumb-wrap #ur_here a,
html body #ur_here.ni-breadcrumb a,
html body #ur_here.ni-soft-breadcrumb a{
  color:var(--ni-breadcrumb-link, var(--ni-breadcrumb-text, #a48d83)) !important;
  -webkit-text-fill-color:var(--ni-breadcrumb-link, var(--ni-breadcrumb-text, #a48d83)) !important;
  text-decoration:none !important;
  border-bottom:1px solid transparent !important;
}
html body .ni-breadcrumb-wrap #ur_here a:hover,
html body .ni-global-breadcrumb-wrap #ur_here a:hover,
html body .ni-listing-shell > .ni-breadcrumb-wrap #ur_here a:hover,
html body .ni-listing-shell > .ni-global-breadcrumb-wrap #ur_here a:hover,
html body .ni-member-shell > .ni-breadcrumb-wrap #ur_here a:hover,
html body .ni-member-shell > .ni-global-breadcrumb-wrap #ur_here a:hover,
html body.ni-page-member .ni-breadcrumb-wrap #ur_here a:hover,
html body.ni-page-category .ni-breadcrumb-wrap #ur_here a:hover,
html body.ni-page-search .ni-breadcrumb-wrap #ur_here a:hover,
html body.ni-page-brand .ni-breadcrumb-wrap #ur_here a:hover,
html body #ur_here.ni-breadcrumb a:hover,
html body #ur_here.ni-soft-breadcrumb a:hover{
  color:var(--ni-breadcrumb-link-hover, #9b6463) !important;
  -webkit-text-fill-color:var(--ni-breadcrumb-link-hover, #9b6463) !important;
  border-bottom-color:rgba(155, 100, 99, .32) !important;
}
html body .ni-breadcrumb-wrap #ur_here code,
html body .ni-global-breadcrumb-wrap #ur_here code,
html body .ni-listing-shell > .ni-breadcrumb-wrap #ur_here code,
html body .ni-listing-shell > .ni-global-breadcrumb-wrap #ur_here code,
html body .ni-member-shell > .ni-breadcrumb-wrap #ur_here code,
html body .ni-member-shell > .ni-global-breadcrumb-wrap #ur_here code,
html body.ni-page-member .ni-breadcrumb-wrap #ur_here code,
html body.ni-page-category .ni-breadcrumb-wrap #ur_here code,
html body.ni-page-search .ni-breadcrumb-wrap #ur_here code,
html body.ni-page-brand .ni-breadcrumb-wrap #ur_here code,
html body #ur_here.ni-breadcrumb code,
html body #ur_here.ni-soft-breadcrumb code{
  margin:0 .18em !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:inherit !important;
  -webkit-text-fill-color:currentColor !important;
  font:inherit !important;
  font-family:inherit !important;
  letter-spacing:inherit !important;
}

.ni-search,
.ni-global-search {
  box-sizing: border-box;
}

.ni-search-form {
  box-sizing: border-box;
}

.ni-search-field {
  position: relative;
  box-sizing: border-box;
}

.ni-drawer {
  position: fixed;
  inset: 0 auto 0 0;
  width: min(86vw, 360px);
  transform: translateX(-102%);
  transition: transform .22s ease;
  z-index: 2147482500;
}

.ni-drawer.is-open,
body.ni-mobile-drawer-open .ni-drawer {
  transform: translateX(0);
}

/* NI_DRAWER_CANONICAL_BEGIN
 * Canonical mobile drawer navigation. The drawer may be mounted directly under body by JS,
 * so these rules are scoped to the drawer DOM itself instead of depending on viewport-only
 * legacy selectors. This prevents browser-width edge cases from exposing unstyled links.
 */
html body > .ni-mobile-luxe-overlay[data-ni-mobile-layer-mounted="1"]{
  display:block!important;
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100vh!important;
  height:100dvh!important;
  z-index:2147483400!important;
  background:rgba(65,52,46,.34)!important;
  -webkit-backdrop-filter:blur(8px)!important;
  backdrop-filter:blur(8px)!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transition:opacity .22s ease, visibility 0s linear .22s!important;
}
html body.ni-mobile-drawer-open > .ni-mobile-luxe-overlay[data-ni-mobile-layer-mounted="1"]{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transition:opacity .22s ease, visibility 0s linear 0s!important;
}
html body > .ni-mobile-luxe-drawer[data-ni-mobile-layer-mounted="1"]{
  display:flex!important;
  position:fixed!important;
  left:0!important;
  top:0!important;
  bottom:auto!important;
  width:min(86vw,326px)!important;
  max-width:326px!important;
  height:100vh!important;
  height:100dvh!important;
  max-height:100dvh!important;
  z-index:2147483410!important;
  padding:18px 16px calc(22px + env(safe-area-inset-bottom))!important;
  flex-direction:column!important;
  gap:16px!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  border-radius:0 28px 28px 0!important;
  background:linear-gradient(180deg,#fffdf9 0%,#f8eee7 100%)!important;
  box-shadow:28px 0 68px rgba(65,47,40,.22)!important;
  box-sizing:border-box!important;
  transform:translate3d(-104%,0,0)!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transition:transform .26s cubic-bezier(.22,.78,.25,1), visibility 0s linear .26s!important;
}
html body.ni-mobile-drawer-open > .ni-mobile-luxe-drawer[data-ni-mobile-layer-mounted="1"]{
  transform:translate3d(0,0,0)!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transition:transform .26s cubic-bezier(.22,.78,.25,1), visibility 0s linear 0s!important;
}
html body .ni-mobile-luxe-drawer .ni-mobile-luxe-drawer-nav{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:18px!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-section{
  display:block!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-sizing:border-box!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-section-title{
  display:block!important;
  width:100%!important;
  margin:0 0 10px!important;
  padding:0 6px!important;
  border:0!important;
  background:transparent!important;
  color:#9a756d!important;
  font:800 15px/1.4 "Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif!important;
  letter-spacing:.06em!important;
  text-align:left!important;
  box-sizing:border-box!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-section-body{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:10px!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-link,
html body .ni-mobile-luxe-drawer .ni-drawer-nav-group,
html body .ni-mobile-luxe-drawer .ni-drawer-nav-toggle{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  box-sizing:border-box!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-nav-group{
  display:block!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-link,
html body .ni-mobile-luxe-drawer .ni-drawer-nav-toggle{
  appearance:none!important;
  -webkit-appearance:none!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  min-height:48px!important;
  margin:0!important;
  padding:0 22px!important;
  border:1px solid rgba(226,207,197,.88)!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#fffefa 0%,#f7efe9 100%)!important;
  box-shadow:0 7px 16px rgba(113,82,68,.055)!important;
  color:#665650!important;
  text-align:left!important;
  text-decoration:none!important;
  font:800 16px/1 "Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif!important;
  letter-spacing:.045em!important;
  cursor:pointer!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-link:after{
  display:block!important;
  content:"›"!important;
  flex:0 0 auto!important;
  color:#c38d86!important;
  font-size:24px!important;
  font-weight:300!important;
  line-height:1!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-nav-toggle .ni-drawer-chevron{
  display:block!important;
  flex:0 0 auto!important;
  color:#c38d86!important;
  font-size:24px!important;
  font-weight:300!important;
  line-height:1!important;
  transform:rotate(0deg)!important;
  transition:transform .18s ease!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-nav-group.is-open .ni-drawer-chevron{
  transform:rotate(90deg)!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-subnav{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:8px!important;
  width:100%!important;
  margin:8px 0 2px!important;
  padding:0 0 0 18px!important;
  box-sizing:border-box!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-subnav[hidden]{display:none!important;}
html body .ni-mobile-luxe-drawer .ni-drawer-subnav-link{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  width:100%!important;
  min-height:36px!important;
  padding:0 14px!important;
  border:0!important;
  border-radius:12px!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#7a665f!important;
  text-decoration:none!important;
  font:700 14px/1 "Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif!important;
  letter-spacing:.035em!important;
  box-sizing:border-box!important;
  transition:background-color .14s ease,color .14s ease,box-shadow .14s ease!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-subnav-link:after{
  content:"›"!important;
  color:#c9a09a!important;
  font-size:18px!important;
  font-weight:300!important;
  line-height:1!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-subnav-link:hover,
html body .ni-mobile-luxe-drawer .ni-drawer-subnav-link:focus,
html body .ni-mobile-luxe-drawer .ni-drawer-subnav-link:active,
html body .ni-mobile-luxe-drawer .ni-drawer-subnav-link.is-active{
  background:rgba(217,171,163,.20)!important;
  color:#6a514a!important;
  box-shadow:inset 4px 0 0 rgba(198,132,132,.42)!important;
  text-decoration:none!important;
  outline:0!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-subnav-link:hover:after,
html body .ni-mobile-luxe-drawer .ni-drawer-subnav-link:focus:after,
html body .ni-mobile-luxe-drawer .ni-drawer-subnav-link:active:after,
html body .ni-mobile-luxe-drawer .ni-drawer-subnav-link.is-active:after{
  color:#b87878!important;
}
html body .ni-mobile-luxe-drawer .ni-drawer-subnav-child{
  margin-left:10px!important;
  width:calc(100% - 10px)!important;
  color:#8d7a72!important;
  font-weight:600!important;
}
@media screen and (min-width:701px){
  html body #mainNav .sub_nav,
  html body #mainNav .u1_over .sub_nav,
  html body #mainNav .u1:hover .sub_nav{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
}
/* NI_DRAWER_CANONICAL_END */

.ni-form-field {
  display: block;
  margin: 0 0 14px;
}

.ni-form-field input,
.ni-form-field select,
.ni-form-field textarea {
  width: 100%;
  box-sizing: border-box;
}

/* Pagination paint: frontend-pagination.css (global canonical owner). */

.ni-alert {
  padding: 12px 14px;
  border: 1px solid var(--ni-color-line);
  border-radius: var(--ni-radius-md);
  background: var(--ni-color-milk);
}

.ni-modal {
  border-radius: var(--ni-radius-lg);
  background: var(--ni-color-surface);
}

/* Migrated shared cartbar/search/footer-guide layer. */
:root{
  --ni-common-frame:960px;
  --ni-common-page:#fffdf9;
  --ni-common-ivory:#fffaf6;
  --ni-common-line:rgba(219,195,181,.62);
  --ni-common-text:#5d514b;
  --ni-common-sub:#8a766f;
  --ni-common-rose:#b77675;
  --ni-common-rose-deep:#9b6463;
  --ni-common-cartbar-bg:linear-gradient(
    165deg,
    rgba(255, 255, 255, 0.08) 0%,
    rgba(255, 252, 248, 0.04) 52%,
    rgba(248, 242, 238, 0.02) 100%
  );
  --ni-common-cartbar-panel:linear-gradient(
    165deg,
    rgba(255, 255, 255, 0.84) 0%,
    rgba(255, 252, 248, 0.68) 44%,
    rgba(248, 242, 238, 0.56) 100%
  );
  --ni-common-cartbar-border:transparent;
  --ni-common-cartbar-inner:rgba(255, 255, 255, 0.34);
  --ni-common-cartbar-shadow:
    0 1px 0 rgba(255, 255, 255, 0.46),
    0 2px 0 rgba(255, 255, 255, 0.14),
    0 44px 88px rgba(42, 30, 24, 0.28),
    0 20px 44px rgba(68, 50, 42, 0.20),
    0 8px 18px rgba(96, 78, 70, 0.13);
  --ni-common-cartbar-shadow-soft:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    inset 0 -2px 0 rgba(78, 58, 50, 0.13),
    0 16px 32px rgba(58, 42, 36, 0.16),
    0 5px 12px rgba(88, 70, 62, 0.11);
  --ni-common-cartbar-highlight:rgba(255, 255, 255, 0.64);
  --ni-common-cartbar-glass-blur:blur(52px) saturate(1.96) brightness(1.06);
  --ni-common-cartbar-glass-blur-inner:blur(36px) saturate(1.52) brightness(1.04);
  --ni-common-cartbar-button:linear-gradient(180deg,#f7e6df 0%,#efd6cc 100%);
  --ni-common-cartbar-button-hover:linear-gradient(180deg,#fbefea 0%,#f2ddd3 100%);
  --ni-common-cartbar-button-border:rgba(214,183,172,.96);
  --ni-common-cartbar-button-shadow:inset 0 1px 0 rgba(255,255,255,.96),0 6px 14px rgba(148,112,102,.14);
  --ni-common-cartbar-button-shadow-hover:inset 0 1px 0 rgba(255,255,255,.98),0 8px 18px rgba(133,93,83,.18);
  --ni-common-cartbar-accent:#b77675;
  --ni-common-cartbar-accent-deep:#9b6463;
}

/* Search outer container is layout-only; input/button keep their own capsule borders. */
html body #search.ni-global-search,
html body.ni-home-index #search.ni-global-search{
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
}
html body #search.ni-global-search .ni-search-field:before{
  border:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}
html body #search.ni-global-search .ni-search-field{
  box-shadow:none !important;
}

/* Desktop cartbar placement: keep it as the right-side item inside #mainNav. */
@media screen and (min-width:701px){
  html body #mainNav .meun_float,
  html body.ni-home-index #mainNav .meun_float{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    flex:0 0 auto !important;
    float:none !important;
    clear:none !important;
    margin-left:auto !important;
    margin-right:0 !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    height:46px !important;
    min-height:46px !important;
    padding:0 clamp(10px,1.8vw,18px) 0 clamp(8px,1.4vw,14px) !important;
    line-height:normal !important;
    position:relative !important;
    z-index:100260 !important;
    overflow:visible !important;
    box-sizing:border-box !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    transform:translateY(-1px) !important;
  }
  html body #mainNav #ECS_CARTINFO,
  html body.ni-home-index #mainNav #ECS_CARTINFO{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    width:auto !important;
    height:36px !important;
    min-height:36px !important;
    line-height:36px !important;
    overflow:visible !important;
    background:transparent !important;
  }
}

/* Shared cartbar surface — NI_CARTBAR_LIQUID_GLASS_DUAL: outer shell very clear, inner panel denser + lifted. */
html body #mainNav .meun_float.ni-cartbar,
html body #mainNav .meun_float[data-ni-cartbar],
html body #mainNav .cart_header_panel,
html body.ni-home-index #mainNav .cart_header_panel,
html body.goods_body #mainNav .cart_header_panel{
  border:0 !important;
  outline:0 !important;
}
html body #mainNav .cart_header_panel,
html body.ni-home-index #mainNav .cart_header_panel,
html body.goods_body #mainNav .cart_header_panel{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  width:auto !important;
  height:42px !important;
  min-height:42px !important;
  line-height:1 !important;
  padding:4px 6px 4px 14px !important;
  margin:0 !important;
  border-radius:999px !important;
  background:var(--ni-common-cartbar-panel) !important;
  box-shadow:var(--ni-common-cartbar-shadow-soft) !important;
  white-space:nowrap !important;
  box-sizing:border-box !important;
  backdrop-filter:var(--ni-common-cartbar-glass-blur-inner) !important;
  -webkit-backdrop-filter:var(--ni-common-cartbar-glass-blur-inner) !important;
}
html body #mainNav .cart_header_panel a:not(.cart_header_checkout),
html body #mainNav .cart_header_summary,
html body #mainNav .cart_header_summary:hover,
html body #mainNav .cart_header_panel:hover .cart_header_summary,
html body #mainNav .cart_header_text,
html body #mainNav .cart_header_text:hover,
html body #mainNav .cart_header_icon,
html body #mainNav .cart_header_icon:hover,
html body #mainNav .cart_header_panel:hover .cart_header_icon,
html body #mainNav .cart_header_total_num,
html body #mainNav .cart_header_total_num:hover,
html body #mainNav .cart_header_panel:hover .cart_header_total_num{
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  filter:none !important;
  transform:none !important;
  text-decoration:none !important;
}
html body #mainNav .cart_header_summary,
html body.goods_body #mainNav .cart_header_summary{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  min-width:0 !important;
  flex:1 1 auto !important;
  height:100% !important;
  line-height:1 !important;
  margin:0 !important;
  padding:0 !important;
  color:var(--ni-common-text) !important;
  -webkit-text-fill-color:var(--ni-common-text) !important;
  font-family:"Hiragino Sans GB","PingFang TC","Noto Sans TC","Microsoft JhengHei",sans-serif !important;
  font-size:clamp(11px,1.25vw,13px) !important;
  font-weight:500 !important;
  letter-spacing:.03em !important;
  cursor:default !important;
}
html body #mainNav .cart_header_icon,
html body #mainNav .cart_header_icon:hover,
html body #mainNav .cart_header_panel:hover .cart_header_icon{
  display:none !important;
  width:0 !important;
  height:0 !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  visibility:hidden !important;
}
html body #mainNav .cart_header_text{
  display:inline-flex !important;
  align-items:center !important;
  gap:4px !important;
  color:var(--ni-common-text) !important;
  -webkit-text-fill-color:var(--ni-common-text) !important;
  font-size:clamp(11px,1.25vw,13px) !important;
  font-weight:500 !important;
  white-space:nowrap !important;
}
html body #mainNav .cart_header_total_num{
  display:inline-block !important;
  position:relative !important;
  top:0 !important;
  min-width:10px !important;
  margin:0 2px !important;
  color:var(--ni-common-cartbar-accent) !important;
  -webkit-text-fill-color:var(--ni-common-cartbar-accent) !important;
  font-family:"Noto Serif TC","Hiragino Mincho ProN","PMingLiU",serif !important;
  font-size:18px !important;
  font-weight:700 !important;
  line-height:1 !important;
  text-align:center !important;
}
html body #mainNav .cart_header_total_num .number,
html body #mainNav .cart_header_total_num font{
  color:inherit !important;
  -webkit-text-fill-color:inherit !important;
  font-weight:inherit !important;
}
html body #mainNav .cart_header_checkout{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  min-width:94px !important;
  height:34px !important;
  min-height:34px !important;
  line-height:34px !important;
  margin:0 !important;
  padding:0 18px !important;
  border:1px solid var(--ni-common-cartbar-button-border) !important;
  border-radius:999px !important;
  background:var(--ni-common-cartbar-button) !important;
  background-image:var(--ni-common-cartbar-button) !important;
  box-shadow:var(--ni-common-cartbar-button-shadow) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  color:var(--ni-common-cartbar-accent-deep) !important;
  -webkit-text-fill-color:var(--ni-common-cartbar-accent-deep) !important;
  font-family:"Noto Serif TC","Hiragino Mincho ProN","PMingLiU",serif !important;
  font-size:14px !important;
  font-weight:700 !important;
  letter-spacing:.1em !important;
  text-shadow:none !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  box-sizing:border-box !important;
  cursor:pointer !important;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .14s cubic-bezier(.2,.8,.2,1),color .18s ease !important;
}
html body #mainNav .cart_header_checkout:hover,
html body #mainNav .cart_header_checkout:focus{
  color:#8d5a59 !important;
  -webkit-text-fill-color:#8d5a59 !important;
  background:var(--ni-common-cartbar-button-hover) !important;
  background-image:var(--ni-common-cartbar-button-hover) !important;
  border-color:rgba(205,171,160,.98) !important;
  box-shadow:var(--ni-common-cartbar-button-shadow-hover) !important;
  transform:translateY(-1px) !important;
}
html body #mainNav .cart_header_checkout:active,
html body #mainNav .cart_header_checkout.ni-common-pressing{
  transform:translateY(0) scale(.988) !important;
  box-shadow:inset 0 2px 4px rgba(160,121,109,.18),0 2px 8px rgba(131,96,88,.10) !important;
}

/* Cart popup shared style. Open state is driven only by JS classes. */
html body #mainNav .meun_float .cartlist,
html body #CARTINFO.cartlist,
html body > #CARTINFO.cartlist.ni-cart-mobile-modal,
html body > .cartlist.ni-cart-mobile-modal{
  display:block !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
  position:absolute !important;
  top:42px !important;
  right:0 !important;
  z-index:100620 !important;
  width:356px !important;
  max-width:calc(100vw - 24px) !important;
  padding:14px 14px 16px !important;
  font-size:13px !important;
  color:#5f584f !important;
  border:1px solid #e8dfd5 !important;
  border-radius:20px !important;
  background:linear-gradient(180deg,#fffdfa 0%,#f7f2eb 100%) !important;
  box-shadow:0 18px 40px rgba(118,95,79,.12) !important;
  transform:translateY(8px) !important;
  transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s !important;
  box-sizing:border-box !important;
}
html body #mainNav .meun_float.cart-open .cartlist,
html body #mainNav .meun_float.ni-cart-open .cartlist,
html body #mainNav .cartlist.ni-cart-open,
html body > #CARTINFO.cartlist.ni-cart-mobile-modal.ni-cart-open,
html body > .cartlist.ni-cart-mobile-modal.ni-cart-open,
html body > #CARTINFO.cartlist.ni-cart-mobile-modal.cart-open,
html body > .cartlist.ni-cart-mobile-modal.cart-open{
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  transform:translateY(0) !important;
  transition:opacity .18s ease,transform .18s ease,visibility 0s linear 0s !important;
}
html body #mainNav .meun_float .cartlist:before,
html body > #CARTINFO.cartlist.ni-cart-mobile-modal:before,
html body > .cartlist.ni-cart-mobile-modal:before{
  content:"" !important;
  position:absolute !important;
  top:-8px !important;
  right:42px !important;
  width:14px !important;
  height:14px !important;
  background:#fcfaf6 !important;
  border-top:1px solid #e8dfd5 !important;
  border-left:1px solid #e8dfd5 !important;
  transform:rotate(45deg) !important;
}
html body #mainNav .cartlist p,
html body > .cartlist p{margin:0 !important;padding:0 !important;}
html body #mainNav .cartlist .p1,
html body > .cartlist .p1{padding:4px 2px 0 !important;color:#5f584f !important;font-size:14px !important;line-height:1.6 !important;}
html body #mainNav .cartlist .cart_empty_hint,
html body > .cartlist .cart_empty_hint{margin-top:4px !important;padding:0 2px !important;color:#9b9388 !important;font-size:12px !important;line-height:1.6 !important;}
html body #mainNav .cartlist .cart_items_scroll,
html body > .cartlist .cart_items_scroll{max-height:320px !important;overflow-y:auto !important;overflow-x:hidden !important;margin-top:2px !important;padding-right:4px !important;}
html body #mainNav .cartlist dl,
html body > .cartlist dl{
  width:auto !important;
  margin:0 !important;
  padding:10px 0 !important;
  display:grid !important;
  grid-template-columns:56px 1fr auto !important;
  grid-template-areas:"thumb title del" "thumb price del" !important;
  gap:4px 12px !important;
  overflow:hidden !important;
  background:none !important;
  position:static !important;
  border:none !important;
  border-bottom:1px solid #eee5da !important;
}
html body #mainNav .cartlist dl:last-of-type,
html body > .cartlist dl:last-of-type{border-bottom:none !important;}
html body #mainNav .cartlist dl dt,
html body > .cartlist dl dt{grid-area:thumb !important;float:none !important;width:auto !important;margin:0 !important;padding:0 !important;}
html body #mainNav .cartlist dl dt img,
html body > .cartlist dl dt img{display:block !important;width:56px !important;height:56px !important;border-radius:14px !important;border:1px solid #ece4da !important;background:#f3ede6 !important;object-fit:contain !important;}
html body #mainNav .cartlist dl dd,
html body > .cartlist dl dd{margin:0 !important;padding:0 !important;clear:none !important;float:none !important;width:auto !important;}
html body #mainNav .cartlist dl dd.title,
html body > .cartlist dl dd.title{grid-area:title !important;height:auto !important;overflow:hidden !important;line-height:1.45 !important;padding-top:2px !important;background:transparent !important;}
html body #mainNav .cartlist dl dd.title a,
html body > .cartlist dl dd.title a{text-decoration:none !important;color:#5d554d !important;font-size:14px !important;background:transparent !important;}
html body #mainNav .cartlist dl dd.attr,
html body > .cartlist dl dd.attr{display:none !important;}
html body #mainNav .cartlist dl dd.price,
html body > .cartlist dl dd.price{grid-area:price !important;display:flex !important;align-items:baseline !important;gap:8px !important;color:#9a9085 !important;}
html body #mainNav .cartlist dl dd.price .span1,
html body > .cartlist dl dd.price .span1{color:#b97f87 !important;font-size:16px !important;font-weight:600 !important;}
html body #mainNav .cartlist dl dd.del,
html body > .cartlist dl dd.del{grid-area:del !important;align-self:center !important;text-align:right !important;}
html body #mainNav .cartlist dl dd.del a,
html body > .cartlist dl dd.del a{text-decoration:none !important;color:#b7a89b !important;font-size:12px !important;line-height:1 !important;}
html body #mainNav .cartlist .btn_box,
html body > .cartlist .btn_box{margin-top:12px !important;padding-top:12px !important;border-top:1px solid #ece3d9 !important;display:flex !important;align-items:flex-end !important;justify-content:space-between !important;gap:14px !important;overflow:visible !important;}
html body #mainNav .cart_total_line,
html body > .cart_total_line{display:flex !important;flex-direction:column !important;align-items:flex-start !important;gap:2px !important;letter-spacing:.04em !important;}
html body #mainNav .cart_total_line:before,
html body > .cart_total_line:before{content:"購物車" !important;color:#b0a59a !important;font-size:11px !important;letter-spacing:.14em !important;}
html body #mainNav .cart_total_num,
html body > .cart_total_num{display:inline-block !important;position:static !important;color:#b97f87 !important;font-size:18px !important;font-weight:600 !important;}
html body #mainNav .cartlist .btn_box .p3 a,
html body > .cartlist .btn_box .p3 a{display:inline-flex !important;align-items:center !important;justify-content:center !important;min-width:108px !important;height:38px !important;padding:0 18px !important;border-radius:999px !important;background:linear-gradient(180deg,#d8c3bc 0%,#cbb3ac 100%) !important;box-shadow:0 6px 14px rgba(177,143,136,.24) !important;text-decoration:none !important;color:#fff !important;letter-spacing:.08em !important;font-size:13px !important;}
html body #mainNav .cartlist .btn_box .p3 a:after,
html body > .cartlist .btn_box .p3 a:after{content:"前往結帳" !important;}

/* Mobile cartbar popup positioning only — visual owner is NI_CARTBAR_MOBILE_CANONICAL below. */
@media screen and (max-width:700px){
  html body #mainNav .meun_float .cartlist{
    left:50% !important;
    right:auto !important;
    top:58px !important;
    width:calc(100vw - 24px) !important;
    max-width:360px !important;
    padding:12px !important;
    transform:translate(-50%,8px) !important;
  }
  html body #mainNav .meun_float.cart-open .cartlist,
  html body #mainNav .meun_float.ni-cart-open .cartlist,
  html body #mainNav .cartlist.ni-cart-open{
    transform:translate(-50%,0) !important;
  }
  html body #mainNav .meun_float .cartlist:before{display:none !important;}
  html body > #CARTINFO.cartlist.ni-cart-mobile-modal,
  html body > .cartlist.ni-cart-mobile-modal{
    position:fixed !important;
    left:50% !important;
    right:auto !important;
    top:var(--ni-cart-popup-top,344px) !important;
    bottom:auto !important;
    width:calc(100vw - 28px) !important;
    max-width:380px !important;
    max-height:calc(100vh - var(--ni-cart-popup-top,344px) - 18px) !important;
    overflow-y:auto !important;
    transform:translate(-50%,8px) !important;
    z-index:2147483000 !important;
  }
  html body > #CARTINFO.cartlist.ni-cart-mobile-modal.ni-cart-open,
  html body > .cartlist.ni-cart-mobile-modal.ni-cart-open,
  html body > #CARTINFO.cartlist.ni-cart-mobile-modal.cart-open,
  html body > .cartlist.ni-cart-mobile-modal.cart-open{
    transform:translate(-50%,0) !important;
  }
  html body > #CARTINFO.cartlist.ni-cart-mobile-modal:before,
  html body > .cartlist.ni-cart-mobile-modal:before{display:none !important;}
}

/* NI_CARTBAR_MOBILE_CANONICAL: one mobile cart island owner for every page type. */
@media screen and (max-width:700px){
  html body #mainNav .meun_float,
  html body #mainNav .meun_float.ni-cartbar,
  html body #mainNav .meun_float[data-ni-cartbar]{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
    position:fixed !important;
    left:10px !important;
    right:10px !important;
    bottom:calc(10px + env(safe-area-inset-bottom)) !important;
    z-index:2147482600 !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    height:70px !important;
    min-height:70px !important;
    margin:0 !important;
    padding:11px 13px !important;
    align-items:center !important;
    justify-content:center !important;
    pointer-events:auto !important;
    transform:none !important;
    filter:none !important;
    float:none !important;
    clear:none !important;
    overflow:visible !important;
    box-sizing:border-box !important;
    border:0 !important;
    border-radius:999px !important;
    background:var(--ni-common-cartbar-bg) !important;
    box-shadow:var(--ni-common-cartbar-shadow) !important;
    isolation:isolate !important;
    backdrop-filter:var(--ni-common-cartbar-glass-blur) !important;
    -webkit-backdrop-filter:var(--ni-common-cartbar-glass-blur) !important;
  }
  html body #mainNav #ECS_CARTINFO,
  html body #mainNav .meun_float #ECS_CARTINFO,
  html body #mainNav .cart_header_panel,
  html body #mainNav .meun_float .cart_header_panel{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }
  html body #mainNav .cart_header_panel,
  html body #mainNav .meun_float .cart_header_panel{
    min-height:46px !important;
    height:46px !important;
    padding:4px 6px 4px 14px !important;
    border:0 !important;
    border-radius:999px !important;
    background:var(--ni-common-cartbar-panel) !important;
    box-shadow:var(--ni-common-cartbar-shadow-soft) !important;
    backdrop-filter:var(--ni-common-cartbar-glass-blur-inner) !important;
    -webkit-backdrop-filter:var(--ni-common-cartbar-glass-blur-inner) !important;
  }
  html body #mainNav .cart_header_summary{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    gap:8px !important;
    overflow:hidden !important;
  }
  html body #mainNav .cart_header_summary,
  html body #mainNav .cart_header_text{
    color:var(--ni-common-text) !important;
    -webkit-text-fill-color:var(--ni-common-text) !important;
    font-size:14px !important;
  }
  html body #mainNav .cart_header_text{
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }
  html body #mainNav .cart_header_total_num{
    color:var(--ni-common-cartbar-accent) !important;
    -webkit-text-fill-color:var(--ni-common-cartbar-accent) !important;
    font-size:22px !important;
    font-weight:700 !important;
    flex:0 0 auto !important;
  }
  html body #mainNav .cart_header_checkout{
    height:36px !important;
    min-height:36px !important;
    min-width:96px !important;
    line-height:36px !important;
    margin-left:8px !important;
    padding:0 18px !important;
    font-size:15px !important;
    font-weight:700 !important;
    flex:0 0 auto !important;
  }
  html body.goods_body #mainNav .meun_float.ni-product-soft-hidden:not(.cart-open):not(.ni-cart-open):not(.ni-common-checkout-hover):not(:hover):not(:focus-within){
    opacity:0 !important;
    pointer-events:none !important;
    transform:translateY(calc(100% + 18px)) !important;
    filter:saturate(.9) !important;
    transition:opacity .22s ease, transform .22s ease, filter .18s ease !important;
  }
  html body.goods_body #mainNav .meun_float.ni-product-soft-hidden.cart-open,
  html body.goods_body #mainNav .meun_float.ni-product-soft-hidden.ni-cart-open,
  html body.goods_body #mainNav .meun_float.ni-common-checkout-hover,
  html body.goods_body #mainNav .meun_float:hover,
  html body.goods_body #mainNav .meun_float:focus-within{
    opacity:1 !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
    filter:none !important;
  }
  /* NI_CONVERGENCE: mobile bottom-space compaction.
   * The previous global 92px padding was a cart-island reserve, but it also
   * created a visible blank area after the footer on mobile pages.  Keep only
   * the device safe-area as body padding; cartbar interaction is handled by
   * the fixed island itself instead of reserving page-height whitespace.
   */
  html body{padding-bottom:env(safe-area-inset-bottom);}
  html body.goods_body{padding-bottom:calc(12px + env(safe-area-inset-bottom));}
}

/* Footer guide shared centering. */
html body .footer_box,
html body #footer,
html body .ni-footer-guide{
  background:#fdfbf8 !important;
  background-color:#fdfbf8 !important;
  background-image:none !important;
}
html body .ni-footer-guide-links,
html body .ni-footer-guide-links.clearfix,
html body .footer_box .ni-footer-guide-links,
html body .footer_box .ni-footer-guide-links.clearfix{
  display:flex !important;
  align-items:stretch !important;
  justify-content:center !important;
  gap:clamp(10px,2.4vw,22px) !important;
  width:100% !important;
  max-width:var(--ni-common-frame) !important;
  margin:0 auto !important;
  padding:0 clamp(12px,3vw,24px) !important;
  float:none !important;
  clear:both !important;
  box-sizing:border-box !important;
}
html body .ni-footer-guide-card,
html body .footer_box .ni-footer-guide-card,
html body .ni-footer-guide a{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  min-width:0 !important;
  max-width:210px !important;
  box-sizing:border-box !important;
}
@media screen and (max-width:700px){
  html body .ni-footer-guide-links,
  html body .ni-footer-guide-links.clearfix,
  html body .footer_box .ni-footer-guide-links,
  html body .footer_box .ni-footer-guide-links.clearfix{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:10px !important;
    padding:0 14px !important;
  }
  html body .ni-footer-guide-card,
  html body .footer_box .ni-footer-guide-card,
  html body .ni-footer-guide a{
    width:100% !important;
    max-width:none !important;
  }
}

/* NI_HEART_ICON_CANONICAL
 * 全站收藏愛心：手繪風格胖愛心（輪廓 / 實心），日系低調淡色，無外框。 */
:root{
  --ni-heart-outline:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M12.15 21.05C6.95 16.85 5.15 13.05 5.45 9.75 5.7 7.05 8.05 5.15 10.65 5.25 11.75 5.3 12.65 5.85 13.25 6.75 13.85 5.8 14.85 5.25 16.05 5.25 18.85 5.15 21.05 7.35 21.25 10.05 21.5 14.25 17.35 18.05 12.15 21.05z'/%3E%3C/svg%3E");
  --ni-heart-filled:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12.15 21.05C6.95 16.85 5.15 13.05 5.45 9.75 5.7 7.05 8.05 5.15 10.65 5.25 11.75 5.3 12.65 5.85 13.25 6.75 13.85 5.8 14.85 5.25 16.05 5.25 18.85 5.15 21.05 7.35 21.25 10.05 21.5 14.25 17.35 18.05 12.15 21.05z'/%3E%3C/svg%3E");
  --ni-heart-idle:#b8a69d;
  --ni-heart-hover:#a8958c;
  --ni-heart-active:#c4a29d;
  --ni-heart-size:28px;
  --ni-heart-size-compact:24px;
  --ni-heart-size-heading:20px;
  --ni-heart-size-display:36px;
  --ni-heart-offset-y:-1px;
}
.ni-heart-icon{
  display:block;
  flex:0 0 auto;
  width:var(--ni-heart-size);
  height:var(--ni-heart-size);
  background-color:var(--ni-heart-idle);
  -webkit-mask:var(--ni-heart-outline) center/contain no-repeat;
  mask:var(--ni-heart-outline) center/contain no-repeat;
  transform:translateY(var(--ni-heart-offset-y));
  transition:background-color .16s ease, transform .16s ease, opacity .16s ease;
}
.ni-heart-btn.is-active .ni-heart-icon,
.ni-heart-btn[aria-pressed="true"] .ni-heart-icon,
.is-active > .ni-heart-icon,
[aria-pressed="true"] > .ni-heart-icon,
.is-active.ni-heart-icon,
[aria-pressed="true"].ni-heart-icon{
  background-color:var(--ni-heart-active);
  -webkit-mask-image:var(--ni-heart-filled);
  mask-image:var(--ni-heart-filled);
}
.ni-heart-btn:hover .ni-heart-icon,
.ni-heart-btn:focus-visible .ni-heart-icon,
button[data-ni-card-favorite]:hover .ni-heart-icon,
button[data-ni-card-favorite]:focus-visible .ni-heart-icon{
  background-color:var(--ni-heart-hover);
}
.ni-heart-btn.is-active:hover .ni-heart-icon,
.ni-heart-btn[aria-pressed="true"]:hover .ni-heart-icon,
button[data-ni-card-favorite].is-active:hover .ni-heart-icon,
button[data-ni-card-favorite][aria-pressed="true"]:hover .ni-heart-icon{
  background-color:#b89590;
}
.ni-heart-btn.is-pending,
button[data-ni-card-favorite].is-pending,
button[data-ni-card-favorite][aria-busy="true"]{
  opacity:.62;
  pointer-events:none;
}
html body.goods_body .ni-v43-btn.ni-heart-btn{
  display:inline-flex;
  align-items:center;
  gap:7px;
}
html body.goods_body .ni-v43-btn.ni-heart-btn .ni-heart-icon{
  width:var(--ni-heart-size-compact);
  height:var(--ni-heart-size-compact);
}
/* style.css 對 button 全域 border/background !important，收藏愛心在此收斂。 */
html body button.ni-heart-btn,
html body button[data-ni-card-favorite],
html body button.ni-product-card__quick{
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  -webkit-appearance:none!important;
  appearance:none!important;
}
html body button.ni-heart-btn:hover,
html body button.ni-heart-btn:focus,
html body button.ni-heart-btn:focus-visible,
html body button[data-ni-card-favorite]:hover,
html body button[data-ni-card-favorite]:focus,
html body button[data-ni-card-favorite]:focus-visible,
html body button.ni-product-card__quick:hover,
html body button.ni-product-card__quick:focus,
html body button.ni-product-card__quick:focus-visible{
  border:0!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
}
.ni-heading-heart::before{
  content:"";
  display:inline-block;
  width:var(--ni-heart-size-heading);
  height:var(--ni-heart-size-heading);
  margin-right:7px;
  vertical-align:2px;
  background-color:var(--ni-heart-active);
  -webkit-mask:var(--ni-heart-filled) center/contain no-repeat;
  mask:var(--ni-heart-filled) center/contain no-repeat;
}
/* NI_CSS_SPLIT_RELOCATED: listing component rules moved to page-specific CSS. Guard markers preserved: NI_LISTING_EXPERIENCE_CANONICAL_START | .ni-listing-guide | .ni-product-card__quick | .ni-product-card__meta | .ni-empty-state--listing | NI_LISTING_EXPERIENCE_CANONICAL_END */

/* NI_CSS_SPLIT_SHARED_COMPONENT_RETAINED: member/order query widgets remain globally loaded. */
/* Member Small Libraries / Order Query Utility convergence */
.ni-member-mini-widget,
.ni-order-query-widget{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(219,195,181,.55);
  border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.78) 0%,rgba(253,251,248,.94) 100%);
  box-shadow:0 14px 30px rgba(120,90,80,.08);
  color:#5d4d45;
  box-sizing:border-box;
}
.ni-member-mini-widget::before,
.ni-order-query-widget::before{
  content:"";
  position:absolute;
  inset:-54px -40px auto auto;
  width:116px;
  height:116px;
  border-radius:999px;
  background:radial-gradient(circle,rgba(215,160,157,.18) 0%,rgba(215,160,157,0) 68%);
  pointer-events:none;
}
.ni-member-mini-widget__head,
.ni-order-query-widget__head{
  position:relative;
  display:grid;
  padding:16px 16px 10px;
}
.ni-member-mini-widget__kicker,
.ni-order-query-widget__kicker{
  margin:0;
}
.ni-member-mini-widget__title,
.ni-order-query-widget__title{
  color:#5d4d45;
  font-family:Georgia,"Times New Roman","Noto Serif TC",serif;
  font-size:18px;
  line-height:1.25;
}
.ni-member-mini-widget__body{
  position:relative;
  padding:0 16px 16px;
}
.ni-member-mini-info{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:10px 12px;
  border:1px solid rgba(219,195,181,.45);
  border-radius:16px;
  background:rgba(255,255,255,.70);
  box-sizing:border-box;
}
.ni-member-mini-info__name,
.ni-member-mini-info__link{
  color:#8f5f61;
  font-size:13px;
  font-weight:900;
  line-height:1.45;
  text-decoration:none;
}
.ni-member-mini-info__link{
  color:#7d6c64;
}
.ni-member-mini-info__name:hover,
.ni-member-mini-info__link:hover,
.ni-member-mini-info__name:focus,
.ni-member-mini-info__link:focus{
  color:#c7656c;
  text-decoration:underline;
  outline:none;
}
.ni-member-mini-info__sep{
  color:#d3b6a7;
  font-size:12px;
  font-weight:900;
}
.ni-order-query-form{
  position:relative;
  display:grid;
  gap:10px;
  padding:0 16px 16px;
  box-sizing:border-box;
}
.ni-order-query-field{
  display:grid;
  gap:7px;
  min-width:0;
}
.ni-order-query-field__label{
  color:#7f6d63;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
}
.ni-order-query-control{
  width:100%;
  min-height:38px;
  border:1px solid rgba(219,195,181,.70);
  border-radius:15px;
  background:rgba(255,255,255,.84);
  color:#5d4d45;
  font-size:14px;
  line-height:1.45;
  padding:8px 12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82);
  box-sizing:border-box;
  outline:none;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.ni-order-query-control:focus{
  border-color:rgba(215,160,157,.78);
  background:#fff;
  box-shadow:0 0 0 4px rgba(215,160,157,.14);
}
.ni-order-query-control.is-filled{
  border-color:rgba(181,143,111,.50);
}
.ni-order-query-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  border:1px solid rgba(199,101,108,.28);
  border-radius:999px;
  background:linear-gradient(135deg,#d7a09d 0%,#c7656c 100%);
  color:#fff;
  font-family:var(--ni-font-button, var(--ni-font-body));
  font-size:13px;
  font-weight:var(--ni-button-font-weight, 700);
  letter-spacing:.08em;
  text-decoration:none;
  cursor:pointer;
  box-shadow:0 10px 22px rgba(120,90,80,.10);
  transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.ni-order-query-button:hover,
.ni-order-query-button:focus{
  transform:translateY(-1px);
  box-shadow:0 14px 26px rgba(120,90,80,.14);
  outline:none;
}
.ni-order-query-button.is-action-pending{
  opacity:.72;
  pointer-events:none;
}
.ni-order-query-result{
  position:relative;
  padding:0 16px 16px;
}
.ni-order-query-result:empty{
  display:none;
}
.ni-order-query-result-card{
  display:grid;
  gap:8px;
  padding:12px;
  border:1px solid rgba(219,195,181,.45);
  border-radius:16px;
  background:rgba(255,255,255,.72);
  box-sizing:border-box;
}
.ni-order-query-result-row{
  display:grid;
  grid-template-columns:minmax(72px,.72fr) minmax(0,1fr);
  gap:10px;
  align-items:start;
  min-width:0;
}
.ni-order-query-result-label{
  color:#8a766f;
  font-size:12px;
  font-weight:900;
  line-height:1.55;
}
.ni-order-query-result-value{
  color:#5d4d45;
  font-size:13px;
  font-weight:900;
  line-height:1.55;
  word-break:break-word;
}
.ni-order-query-result-value--status{
  color:#c7656c;
}
.ni-order-query-result-link{
  color:#8f5f61;
  text-decoration:none;
}
.ni-order-query-result-link:hover,
.ni-order-query-result-link:focus{
  color:#c7656c;
  text-decoration:underline;
  outline:none;
}
@media (prefers-reduced-motion: reduce){
  .ni-order-query-button,
  .ni-order-query-control{
    transition:none!important;
  }
}

/* NI_FRONTEND_KICKER_CANONICAL: 全前台英文 kicker 色票與中文標題間距唯一來源。 */
html body :is(
  .ni-passport-card__head,
  .ni-listing-hero__header,
  .ni-edge-hero__header,
  .ni-flow-auth-card__head,
  .ni-flow-step-hero__body,
  .ni-payment-notice__hero,
  .ni-member-dashboard__intro,
  .ni-member-dashboard__welcome,
  .ni-member-subpage-head > div,
  .ni-member-subpage-head__body,
  .ni-member-mini-widget__head,
  .ni-order-query-widget__head,
  .ni-flow-checkout-title-stack,
  [data-ni-address-form-contract] .ni-member-subpage-head > div,
  [data-ni-address-form-contract] .ni-member-subpage-head__body
){
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  align-content:start !important;
  justify-items:start !important;
  row-gap:var(--ni-kicker-title-gap) !important;
  column-gap:0 !important;
  gap:var(--ni-kicker-title-gap) !important;
}
html body :is(
  .ni-passport-card__head,
  .ni-listing-hero__header,
  .ni-edge-hero__header,
  .ni-flow-auth-card__head,
  .ni-flow-step-hero__body,
  .ni-payment-notice__hero,
  .ni-member-dashboard__intro,
  .ni-member-dashboard__welcome,
  .ni-member-subpage-head > div,
  .ni-member-subpage-head__body,
  .ni-member-mini-widget__head,
  .ni-order-query-widget__head,
  .ni-flow-checkout-title-stack,
  [data-ni-address-form-contract] .ni-member-subpage-head > div,
  [data-ni-address-form-contract] .ni-member-subpage-head__body
) > *{
  margin:0 !important;
}
html body :is(
  [class*="__kicker"],
  .ni-flow-kicker,
  .ni-section-kicker,
  .ni-order-kicker,
  .ni-listing-toolbar__eyebrow,
  .ni-sidebar-card__eyebrow,
  .ni-empty-state__kicker,
  .ni-flow-done-card__eyebrow,
  .ni-flow-checkout-kicker
):not(.ni-article-kicker){
  padding:0 !important;
  color:var(--ni-kicker-color) !important;
  font-size:var(--ni-kicker-font-size) !important;
  font-weight:var(--ni-kicker-font-weight) !important;
  letter-spacing:var(--ni-kicker-letter-spacing) !important;
  line-height:var(--ni-kicker-line-height) !important;
  text-transform:uppercase !important;
}
html body :is(
  [class*="__kicker"],
  .ni-flow-kicker,
  .ni-section-kicker,
  .ni-order-kicker
):not(.ni-article-kicker):not(
  :is(
    .ni-passport-card__head,
    .ni-listing-hero__header,
    .ni-edge-hero__header,
    .ni-flow-auth-card__head,
    .ni-flow-step-hero__body,
    .ni-payment-notice__hero,
    .ni-member-dashboard__intro,
    .ni-member-dashboard__welcome,
    .ni-member-subpage-head > div,
    .ni-member-subpage-head__body,
    .ni-member-mini-widget__head,
    .ni-order-query-widget__head,
    .ni-flow-checkout-title-stack,
    [data-ni-address-form-contract] .ni-member-subpage-head > div,
    [data-ni-address-form-contract] .ni-member-subpage-head__body
  ) > *
){
  margin:0 0 var(--ni-kicker-title-gap) !important;
}
html body :is(
  [class*="__kicker"],
  .ni-flow-kicker,
  .ni-section-kicker,
  .ni-order-kicker
):not(.ni-article-kicker)::before{
  background:var(--ni-kicker-line) !important;
}