/* KOPKEN v31.0.15 — Storefront Status / Full-Screen Closed Gate */
body.kopken-v319[data-storefront-status="checking"] #v319StorefrontClosed{display:none!important}
.v319-storefront-closed{
  position:fixed;inset:0;z-index:20000;display:grid;place-items:center;
  min-height:100dvh;padding:max(20px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  background:radial-gradient(circle at 50% 4%,rgba(172,30,34,.10),transparent 32%),var(--bg-page,#f8f5f2);
  color:var(--text);overflow:auto;overscroll-behavior:none;
}
.v319-storefront-closed[hidden]{display:none!important}
.v319-closed-card{
  width:min(100%,420px);padding:30px 22px 22px;border:1px solid rgba(172,30,34,.13);border-radius:28px;
  background:linear-gradient(180deg,rgba(255,249,247,.99),rgba(255,255,255,.99));text-align:center;
  box-shadow:0 24px 70px rgba(68,35,30,.12);animation:v319ClosedEnter .42s cubic-bezier(.2,.8,.2,1) both
}
.v319-closed-visual{width:116px;height:90px;margin:0 auto 7px;display:grid;place-items:center;color:#AC1E22}
.v319-closed-graphic{display:none;width:100%;height:100%;overflow:visible;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
#v319StorefrontClosed[data-closed-reason="regular"] .v319-closed-graphic--regular,#v319StorefrontClosed:not([data-closed-reason]) .v319-closed-graphic--regular{display:block}
#v319StorefrontClosed[data-closed-reason="break"] .v319-closed-graphic--break{display:block}
#v319StorefrontClosed[data-closed-reason="temporary"] .v319-closed-graphic--temporary{display:block}
.v319-cup-body{fill:rgba(172,30,34,.06)}
.v319-cup-heart{fill:#AC1E22;stroke:none;opacity:.9;transform-origin:58px 58px;animation:v319Heart 3.8s ease-in-out infinite}
.v319-steam{opacity:.55;animation:v319Steam 3.2s ease-in-out infinite}.v319-steam--2{animation-delay:.55s}.v319-steam--3{animation-delay:1.1s}
.v319-closed-badge{display:inline-flex;align-items:center;gap:7px;min-height:28px;padding:0 11px;border-radius:999px;background:rgba(172,30,34,.08);color:#9f1c20;font-size:10.5px;font-weight:800;letter-spacing:.065em;text-transform:uppercase}
.v319-closed-badge i{width:7px;height:7px;border-radius:50%;background:#AC1E22;box-shadow:0 0 0 0 rgba(172,30,34,.24);animation:v319Pulse 2.5s ease-out infinite}
.v319-storefront-closed h2{margin:12px 0 7px;font-size:clamp(27px,8vw,34px);line-height:1.04;letter-spacing:-.04em;text-transform:lowercase}
.v319-storefront-closed p{max-width:340px;margin:0 auto;color:var(--muted);font-size:13.5px;line-height:1.58}

.v319-closed-channel{margin-top:18px;padding:13px 13px 12px;border:1px solid rgba(37,211,102,.18);border-radius:16px;background:rgba(37,211,102,.055);text-align:left}
.v319-storefront-closed .v319-closed-channel p{margin:0;color:var(--muted);font-size:11.5px;line-height:1.5}
.v319-closed-channel a{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;margin-top:10px;padding:0 14px;border-radius:13px;background:#25D366;color:#0b2d18;text-decoration:none;font-size:12px;font-weight:850;box-shadow:0 9px 20px rgba(37,211,102,.16)}
.v319-closed-channel a:active{transform:translateY(1px)}
html.dark .v319-closed-channel{background:rgba(37,211,102,.08);border-color:rgba(37,211,102,.18)}
html.dark .v319-closed-channel a{color:#092b17}

.v319-closed-actions{display:flex;justify-content:center;margin-top:20px}
.v319-closed-actions button{width:100%;min-height:48px;border-radius:15px;padding:0 18px;border:1px solid #AC1E22;background:#AC1E22;color:#fff;font:inherit;font-size:13px;font-weight:800;cursor:pointer;touch-action:manipulation;box-shadow:0 10px 22px rgba(172,30,34,.17)}
.v319-closed-actions button:active{transform:translateY(1px)}.v319-closed-actions button:disabled{opacity:.62;cursor:wait}
.v319-closed-signature{display:block;margin-top:15px;color:var(--muted);font-size:10.5px;font-weight:700;letter-spacing:.025em}
body.is-storefront-closed{overflow:hidden!important;overscroll-behavior:none}
body.is-storefront-closed > :not(#v319StorefrontClosed):not(script){display:none!important}
body.is-storefront-closed #v319StorefrontClosed{display:grid!important}
html.dark .v319-storefront-closed{background:radial-gradient(circle at 50% 4%,rgba(255,120,126,.08),transparent 32%),#171311}
html.dark .v319-closed-card{background:linear-gradient(180deg,#251d1b,#211b19);border-color:rgba(255,150,154,.16);box-shadow:0 24px 70px rgba(0,0,0,.34)}
html.dark .v319-closed-badge{background:rgba(255,120,126,.1);color:#ff969a}html.dark .v319-closed-badge i{background:#ff7b80}
html.dark .v319-storefront-closed p,html.dark .v319-closed-signature{color:#b9aaa3}
@keyframes v319ClosedEnter{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
@keyframes v319Steam{0%,100%{opacity:.12;transform:translateY(5px)}45%{opacity:.6;transform:translateY(-5px)}70%{opacity:0;transform:translateY(-10px)}}
@keyframes v319Pulse{0%{box-shadow:0 0 0 0 rgba(172,30,34,.22)}70%{box-shadow:0 0 0 7px rgba(172,30,34,0)}100%{box-shadow:0 0 0 0 rgba(172,30,34,0)}}
@keyframes v319Heart{0%,88%,100%{transform:scale(1)}92%{transform:scale(1.06)}96%{transform:scale(.98)}}
@media (max-width:359px){.v319-closed-card{padding:24px 16px 18px;border-radius:24px}.v319-closed-visual{width:96px;height:76px}.v319-storefront-closed h2{font-size:27px}.v319-storefront-closed p{font-size:12.5px}.v319-closed-actions button{min-height:46px}}
@media (min-width:430px){.v319-closed-card{padding:34px 26px 24px}.v319-storefront-closed p{font-size:14px}}
@media (prefers-reduced-motion:reduce){.v319-closed-card,.v319-steam,.v319-closed-badge i,.v319-cup-heart{animation:none!important}}


/* =========================================================
   KOPKEN v31.0.10 — Juwara / Bundle Options / Desktop Utility
   Fresh revision from v31.0.9 baseline; previous R1 overrides are not reused.
   ========================================================= */

/* The drink-options sheet is appended to <body>. v31.0.5+ raised the product-detail
   modal to z-index 7800, while the older sheet stayed at 4200 and became unclickable
   behind the detail modal. Keep the lightweight sheet above detail, below order-ready. */
body.kopken-v3110 .drink-option-popup{z-index:8300!important}
body.kopken-v3110 .drink-option-popup__sheet{max-height:min(78dvh,620px)!important;overflow:auto!important;-webkit-overflow-scrolling:touch}

/* Desktop remains a centered mobile shell. Only the two utility cards become an equal
   two-column row. Reset old named-grid rules inherited from v31.0.1 that otherwise
   place Outlet and WiFi on different implicit rows. */
@media (min-width:768px){
  body.kopken-v3110 #mainHeader .v313-utility-row{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-template-rows:1fr!important;
    grid-template-areas:none!important;
    gap:8px!important;
    align-items:stretch!important;
    width:100%!important;
    margin:0 0 9px!important;
  }
  body.kopken-v3110 #mainHeader .v313-utility-row > .selected-outlet-badge.v313-outlet-card,
  body.kopken-v3110 #mainHeader .v313-utility-row > .v312-daily-wifi-card{
    grid-area:auto!important;
    grid-column:auto!important;
    grid-row:auto!important;
    align-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    min-height:76px!important;
    height:76px!important;
    margin:0!important;
    padding:9px!important;
    border-radius:14px!important;
    box-sizing:border-box!important;
  }
  body.kopken-v3110 #mainHeader .v313-utility-row > .selected-outlet-badge.v313-outlet-card{
    grid-template-columns:36px minmax(0,1fr) auto!important;
    grid-template-rows:1fr!important;
    gap:7px!important;
  }
  body.kopken-v3110 #mainHeader .v313-utility-row > .v312-daily-wifi-card{
    display:grid!important;
    grid-template-columns:36px minmax(0,1fr) 38px!important;
    grid-template-rows:1fr!important;
    gap:7px!important;
    align-items:center!important;
  }
  body.kopken-v3110 #mainHeader .v313-utility-row .v312-wifi-mark,
  body.kopken-v3110 #mainHeader .v313-utility-row .daily-wifi-main,
  body.kopken-v3110 #mainHeader .v313-utility-row .v312-wifi-copy{
    grid-area:auto!important;
    grid-column:auto!important;
    grid-row:auto!important;
    align-self:center!important;
  }
  body.kopken-v3110 #mainHeader .v313-utility-row .v312-wifi-mark{
    width:36px!important;height:36px!important;
  }
  body.kopken-v3110 #mainHeader .v313-utility-row .v312-wifi-copy{
    width:38px!important;min-width:38px!important;height:38px!important;min-height:38px!important;padding:0!important;
  }
  body.kopken-v3110 #mainHeader .v313-utility-row .v312-daily-wifi-card #dailyWifiPassword{
    font-size:9.8px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
  }
}

@media (prefers-reduced-motion:reduce){
  body.kopken-v3110 .drink-option-popup__sheet{animation:none!important}
}

/* ===== v31.0.13 — compact NEW product badge ===== */
body.kopken-v31 .product-image{position:relative!important}
body.kopken-v31 .product-new-badge{
  position:absolute;
  z-index:2;
  top:8px;
  left:8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:20px;
  padding:3px 7px;
  border-radius:999px;
  background:var(--v314-red,#c91f2a);
  color:#fff;
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 2px 7px rgba(80,20,24,.14);
  font-size:8px;
  line-height:1;
  font-weight:900;
  letter-spacing:.055em;
  pointer-events:none;
}
@media (max-width:359px){
  body.kopken-v31 .product-new-badge{top:6px;left:6px;min-height:18px;padding:3px 6px;font-size:7.5px}
}



/* v31.0.17 — compact paid modifier explanation in payment summary */
.summary-row.summary-modifier-info {
  align-items: center;
  gap: 10px;
  padding-top: 2px;
  padding-bottom: 2px;
  color: var(--muted, #756b66);
  font-size: 12px;
}
.summary-row.summary-modifier-info > span {
  min-width: 0;
  line-height: 1.35;
}
.summary-row.summary-modifier-info > small {
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 700;
  color: inherit;
}
html.dark .summary-row.summary-modifier-info { color: #cbbdb5; }

/* v31.0.18 — modifier upgrade normal → promo presentation */
.summary-row.summary-modifier-info {
  align-items: center;
  gap: 10px;
}
.summary-row.summary-modifier-info > span:first-child {
  font-weight: 650;
  color: var(--text, #2f2926);
}
.summary-modifier-price {
  margin-left: auto;
  display: inline-flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 5px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.summary-modifier-price del {
  color: var(--muted, #8a817c);
  font-size: 11px;
  text-decoration-thickness: 1px;
}
.summary-modifier-price strong {
  color: var(--v314-red, #c91f2a);
  font-size: 12px;
  font-weight: 800;
}
.summary-modifier-arrow {
  color: var(--muted, #8a817c);
  font-size: 11px;
}
.summary-modifier-price small {
  font-size: 10px;
  font-weight: 800;
  color: var(--muted, #756b66);
}
html.dark .summary-row.summary-modifier-info > span:first-child { color: #eee2da; }
html.dark .summary-modifier-price del,
html.dark .summary-modifier-arrow,
html.dark .summary-modifier-price small { color: #bdaea6; }
@media (max-width: 359px){
  .summary-row.summary-modifier-info { gap: 7px; }
  .summary-row.summary-modifier-info > span:first-child { font-size: 11px; }
  .summary-modifier-price { gap: 3px; }
  .summary-modifier-price del { font-size: 10px; }
  .summary-modifier-price strong { font-size: 11px; }
}


/* v31.0.21 — aggregated upgrade summary: totals, not per-item averages */
.summary-modifier-head{
  margin-top:6px;
  padding-top:7px;
  border-top:1px dashed rgba(120,104,96,.18);
  color:var(--muted,#756b66);
  font-size:10px;
  line-height:1.2;
  font-weight:850;
  letter-spacing:.065em;
}
.summary-modifier-note{
  margin:-1px 0 4px;
  color:var(--muted,#756b66);
  font-size:10.5px;
  line-height:1.35;
  font-weight:600;
}
.summary-row.summary-modifier-info > span:first-child{font-weight:700}
.summary-modifier-price del{font-size:11px}
.summary-modifier-price strong{font-size:12px}
html.dark .summary-modifier-head,
html.dark .summary-modifier-note{color:#bdaea6;border-color:rgba(238,219,206,.12)}
@media (max-width:359px){
  .summary-modifier-head{font-size:9.5px}
  .summary-modifier-note{font-size:10px}
}


/* v31.0.23 — split optional Syrup/Topping accordions + mobile micro-interactions */
body.kopken-v3123 .optional-addon-accordion{
  margin-top:9px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:14px;
  background:rgba(148,163,184,.045);
  overflow:hidden;
  contain:layout paint;
}
body.kopken-v3123 .optional-addon-accordion[hidden]{display:none!important}
body.kopken-v3123 .optional-addon-toggle{
  width:100%;
  min-height:48px;
  padding:10px 12px;
  border:0;
  background:transparent;
  color:inherit;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  text-align:left;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
body.kopken-v3123 .optional-addon-toggle__copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
body.kopken-v3123 .optional-addon-toggle__copy strong{font-size:12px;line-height:1.3}
body.kopken-v3123 .optional-addon-toggle__copy small{
  font-size:9.5px;
  line-height:1.3;
  color:var(--v31-muted,#667085);
  font-weight:650;
}
body.kopken-v3123 .optional-addon-toggle__chevron{
  flex:0 0 auto;
  font-size:20px;
  line-height:1;
  color:var(--v31-muted,#667085);
  transform:rotate(0deg);
  transition:transform .2s ease;
}
body.kopken-v3123 .optional-addon-accordion.is-open .optional-addon-toggle__chevron{transform:rotate(90deg)}
body.kopken-v3123 .optional-addon-panel{
  display:grid;
  grid-template-rows:0fr;
  opacity:.3;
  border-top:1px solid transparent;
  transition:grid-template-rows .22s ease,opacity .18s ease,border-color .18s ease;
}
body.kopken-v3123 .optional-addon-panel__inner{
  min-height:0;
  overflow:hidden;
  padding:0 10px;
}
body.kopken-v3123 .optional-addon-accordion.is-open .optional-addon-panel{
  grid-template-rows:1fr;
  opacity:1;
  border-top-color:rgba(148,163,184,.16);
}
body.kopken-v3123 .optional-addon-accordion.is-open .optional-addon-panel__inner{padding-bottom:9px}
body.kopken-v3123 .optional-addon-option{
  position:relative;
  min-height:43px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto 20px;
  align-items:center;
  gap:8px;
  padding:7px 3px;
  border-bottom:1px solid rgba(148,163,184,.12);
  cursor:pointer;
  font-size:11px;
  line-height:1.35;
  -webkit-tap-highlight-color:transparent;
}
body.kopken-v3123 .optional-addon-option:last-child{border-bottom:0}
body.kopken-v3123 .optional-addon-option>span:first-child{font-weight:650}
body.kopken-v3123 .optional-addon-option__price{
  white-space:nowrap;
  color:var(--v31-muted,#667085);
  font-size:10px;
  font-weight:700;
}
body.kopken-v3123 .optional-addon-option input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
body.kopken-v3123 .optional-addon-option i{
  width:18px;
  height:18px;
  border:1.5px solid rgba(100,116,139,.55);
  border-radius:5px;
  display:grid;
  place-items:center;
  background:var(--v31-card,#fff);
  transition:transform .14s ease,border-color .14s ease,background .14s ease;
}
body.kopken-v3123 .optional-addon-option input:checked+i{
  border-color:#ac1e22;
  background:#ac1e22;
  transform:scale(1.04);
}
body.kopken-v3123 .optional-addon-option input:checked+i::after{
  content:"";
  width:7px;
  height:4px;
  border-left:2px solid #fff;
  border-bottom:2px solid #fff;
  transform:rotate(-45deg) translateY(-1px);
}
body.kopken-v3123 .optional-addon-option:focus-within{
  outline:2px solid rgba(172,30,34,.16);
  outline-offset:1px;
  border-radius:7px;
}
body.kopken-v3123 .cart-optional-addons{
  margin-top:4px;
  font-size:10px;
  line-height:1.45;
  color:var(--v31-muted,#667085);
}
body.kopken-v3123 .cart-optional-addons strong{color:inherit}
html.dark body.kopken-v3123 .optional-addon-accordion{
  background:rgba(255,255,255,.03);
  border-color:rgba(238,219,206,.12);
}
html.dark body.kopken-v3123 .optional-addon-accordion.is-open .optional-addon-panel,
html.dark body.kopken-v3123 .optional-addon-option{border-color:rgba(238,219,206,.09)}
html.dark body.kopken-v3123 .optional-addon-option i{background:rgba(255,255,255,.04)}

/* Lightweight press feedback for primary storefront controls. */
body.kopken-v3123 :is(.btn-plus,.pill,.detail-cta,.detail-x,.detail-qty-control button,.qty-pill button,.cart-edit,.cart-remove,.chip,.optional-addon-toggle,.voucher-redeem-toggle,.voucher-redeem-form button,.pickup-schedule__toggle,.fab-cart,.header-action-btn){
  transition:transform .14s ease,opacity .14s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease;
  transform-origin:center;
  -webkit-tap-highlight-color:transparent;
}
body.kopken-v3123 :is(.btn-plus,.pill,.detail-cta,.detail-x,.detail-qty-control button,.qty-pill button,.cart-edit,.cart-remove,.chip,.optional-addon-toggle,.voucher-redeem-toggle,.voucher-redeem-form button,.pickup-schedule__toggle,.fab-cart,.header-action-btn):active:not(:disabled){
  transform:scale(.975);
}
body.kopken-v3123 .btn-plus:active:not(:disabled),
body.kopken-v3123 .detail-qty-control button:active:not(:disabled),
body.kopken-v3123 .qty-pill button:active:not(:disabled){transform:scale(.92)}
body.kopken-v3123 :is(button,[role="button"]):disabled{cursor:not-allowed}

@media (prefers-reduced-motion:reduce){
  body.kopken-v3123 .optional-addon-panel,
  body.kopken-v3123 .optional-addon-toggle__chevron,
  body.kopken-v3123 .optional-addon-option i,
  body.kopken-v3123 :is(.btn-plus,.pill,.detail-cta,.detail-x,.detail-qty-control button,.qty-pill button,.cart-edit,.cart-remove,.chip,.optional-addon-toggle,.voucher-redeem-toggle,.voucher-redeem-form button,.pickup-schedule__toggle,.fab-cart,.header-action-btn){transition:none!important}
}


/* =========================================================
   v31.0.24 — outlet onboarding clarity + promo/nav stacking
   ========================================================= */
body.kopken-v3124.channel-promo-open #brandBurgerNav{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(-8px)!important;transition:opacity .16s ease,transform .16s ease,visibility .16s ease!important;}
body.kopken-v3124.channel-promo-open #brandBurgerNav .brand-burger-nav__bar{opacity:0!important;visibility:hidden!important;}
body.kopken-v3124 .ramean-promo-banner-modal{z-index:8200!important;}
body.kopken-v3124 .outlet-modal__head h3{letter-spacing:-.015em;}
body.kopken-v3124 .outlet-search-wrap input{min-height:48px;}
@media (prefers-reduced-motion:reduce){body.kopken-v3124.channel-promo-open #brandBurgerNav{transition:none!important;}}


/* =========================================================
   v31.0.25 — compact outlet onboarding + loyalty stamp motion
   ========================================================= */
body.kopken-v3125 .outlet-modal__head{margin-bottom:8px!important}
body.kopken-v3125 .outlet-modal__head h3{margin-bottom:3px!important}
body.kopken-v3125 .outlet-modal__head p{max-width:30ch!important;margin:0!important;font-size:10.5px!important;line-height:1.4!important}
body.kopken-v3125 .outlet-search-guide{margin-bottom:8px!important}

/* Loyalty stamp refresh: use the provided BroyApps x LaperDiskon seal as the
   earned-stamp identity, with a subtle animated centre crop for the newest stamp. */
body.kopken-v3125 .member-stamp-mark{
  --stamp-rotation:-3deg;
  transform:rotate(var(--stamp-rotation));
  isolation:isolate;
}
body.kopken-v3125 .member-stamp-mark:nth-child(even){--stamp-rotation:3deg;transform:rotate(var(--stamp-rotation))}
body.kopken-v3125 .member-stamp-mark.is-earned{
  overflow:visible;
  border-style:solid;
  border-color:color-mix(in srgb,var(--v314-red,var(--v31-accent)) 66%,transparent);
  background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.98) 0 52%,rgba(255,245,246,.96) 72%,rgba(255,236,239,.98) 100%);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.96),0 5px 14px rgba(169,30,35,.12);
  animation:memberStampPress .48s cubic-bezier(.22,.8,.28,1) backwards;
  animation-delay:calc(var(--stamp-i,0) * 42ms);
  will-change:transform,opacity;
}
body.kopken-v3125 .member-stamp-mark.is-earned .member-stamp-seal{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  border-radius:50%;
  background-image:url('./img/broyapps-loyalty-stamp.png');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  filter:drop-shadow(0 2px 5px rgba(169,30,35,.10));
  animation:memberStampSealSettle .56s ease-out backwards;
  animation-delay:calc((var(--stamp-i,0) * 42ms) + 10ms);
}
body.kopken-v3125 .member-stamp-mark.is-earned .member-stamp-core{
  position:absolute;
  inset:24%;
  border-radius:50%;
  background-image:url('./img/broyapps-loyalty-stamp.png');
  background-size:168%;
  background-position:center;
  background-repeat:no-repeat;
  box-shadow:0 0 0 2px rgba(255,255,255,.94),0 4px 8px rgba(169,30,35,.10);
  animation:memberStampCoreReveal .48s ease-out backwards;
  animation-delay:calc((var(--stamp-i,0) * 42ms) + 50ms);
  will-change:transform,filter;
}
body.kopken-v3125 .member-stamp-mark.is-earned b{
  position:relative;
  z-index:1;
  font-weight:950!important;
  text-shadow:0 1px 0 rgba(255,255,255,.72);
}
body.kopken-v3125 .member-stamp-mark.is-latest .member-stamp-core{
  animation:memberStampCoreReveal .48s ease-out backwards,
            memberStampCorePulse 1.15s ease-in-out 2;
  animation-delay:calc((var(--stamp-i,0) * 42ms) + 50ms),calc((var(--stamp-i,0) * 42ms) + .42s);
}
body.kopken-v3125 .member-stamp-mark.is-latest::after{
  content:"";
  position:absolute;
  inset:-4px;
  border:1.5px solid color-mix(in srgb,var(--v314-red,var(--v31-accent)) 52%,transparent);
  border-radius:50%;
  pointer-events:none;
  opacity:0;
  animation:memberStampLatestHalo 1.15s ease-out 2;
  animation-delay:calc((var(--stamp-i,0) * 42ms) + .34s);
}
@keyframes memberStampPress{
  0%{opacity:0;transform:translateY(-7px) scale(1.14) rotate(var(--stamp-rotation))}
  58%{opacity:1;transform:translateY(1px) scale(.93) rotate(var(--stamp-rotation))}
  78%{transform:translateY(0) scale(1.035) rotate(var(--stamp-rotation))}
  100%{opacity:1;transform:translateY(0) scale(1) rotate(var(--stamp-rotation))}
}
@keyframes memberStampSealSettle{
  0%{opacity:0;transform:scale(.88) rotate(-6deg)}
  68%{opacity:1;transform:scale(1.03) rotate(1.5deg)}
  100%{opacity:1;transform:scale(1) rotate(0)}
}
@keyframes memberStampCoreReveal{
  0%{opacity:0;transform:translateY(-2px) scale(.76)}
  70%{opacity:1;transform:translateY(0) scale(1.04)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes memberStampCorePulse{
  0%,100%{transform:translateY(0) scale(1);filter:saturate(1)}
  45%{transform:translateY(-1px) scale(1.06);filter:saturate(1.06)}
}
@keyframes memberStampLatestHalo{
  0%{opacity:.42;transform:scale(.9)}
  70%{opacity:0;transform:scale(1.22)}
  100%{opacity:0;transform:scale(1.22)}
}
@media (prefers-reduced-motion:reduce){
  body.kopken-v3125 .member-stamp-mark.is-earned,
  body.kopken-v3125 .member-stamp-mark.is-earned .member-stamp-seal,
  body.kopken-v3125 .member-stamp-mark.is-earned .member-stamp-core,
  body.kopken-v3125 .member-stamp-mark.is-latest::after{animation:none!important}
}


/* v31.0.27 — Loyalty threshold clarity. Keep the rule inside the Stamp card,
   where members naturally look for how a Stamp is earned. */
body.kopken-v3127 .member-stamp-rule{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:6px;
  margin:2px 0 8px;
  padding:7px 9px;
  border:1px solid color-mix(in srgb,var(--v31-accent) 15%,var(--v31-line));
  border-radius:11px;
  background:color-mix(in srgb,var(--v31-soft) 58%,var(--v31-card));
  line-height:1.15;
}
body.kopken-v3127 .member-stamp-rule span{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:20px;padding:0 6px;border-radius:999px;
  background:var(--v31-accent);color:#fff;
  font-size:6px;font-weight:950;letter-spacing:.06em;white-space:nowrap;
}
body.kopken-v3127 .member-stamp-rule strong{
  min-width:0;color:var(--v31-text);font-size:8.5px;font-weight:900;
}
body.kopken-v3127 .member-stamp-rule small{
  color:var(--v31-muted);font-size:6.4px;font-weight:700;white-space:nowrap;
}
@media (max-width:350px){
  body.kopken-v3127 .member-stamp-rule{grid-template-columns:auto 1fr}
  body.kopken-v3127 .member-stamp-rule small{grid-column:2;white-space:normal;margin-top:-2px}
}


/* ===== KOPKEN v31.0.29-R8 — focused closed-state channel CTA ===== */
.v319-closed-channel{
  margin-top:20px;padding:15px;border:1px solid rgba(172,30,34,.12);border-radius:18px;
  background:linear-gradient(180deg,rgba(172,30,34,.035),rgba(172,30,34,.015));text-align:left;
}
.v319-closed-channel__eyebrow{display:inline-flex;align-items:center;min-height:23px;padding:0 8px;border-radius:999px;background:rgba(172,30,34,.08);color:#9f1c20;font-size:9px;font-weight:850;letter-spacing:.055em;text-transform:uppercase}
.v319-storefront-closed .v319-closed-channel p{max-width:none;margin:10px 0 0;color:var(--muted);font-size:11.5px;line-height:1.45}
.v319-storefront-closed .v319-closed-channel p strong{display:block;margin-bottom:3px;color:var(--text);font-size:13px;line-height:1.3}
.v319-storefront-closed .v319-closed-channel p span{display:block}
.v319-closed-channel a{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:9px;width:100%;min-height:48px;margin-top:12px;padding:0 13px;border-radius:14px;background:#AC1E22;color:#fff;text-decoration:none;font-size:12px;font-weight:850;box-shadow:0 10px 22px rgba(172,30,34,.16)}
.v319-closed-channel a i{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:transparent;color:#fff;font-size:8px;font-style:normal;font-weight:950;letter-spacing:-.02em}.v319-closed-channel__wa-icon img{display:block;width:22px;height:22px;filter:brightness(0) invert(1)}
.v319-closed-channel a span{min-width:0}.v319-closed-channel a b{font-size:18px;font-weight:600;line-height:1}
.v319-closed-channel a:active{transform:translateY(1px)}
.v319-closed-actions{display:none!important}
html.dark .v319-closed-channel{background:rgba(255,255,255,.025);border-color:rgba(255,150,154,.13)}
html.dark .v319-closed-channel__eyebrow{background:rgba(255,120,126,.1);color:#ff969a}
html.dark .v319-closed-channel a{background:#c52b30;color:#fff}

/* =========================================================
   KOPKEN v31.0.29-R12.4.1 — RESTOCK GATE + CLOSED MOTION VARIANTS
   ========================================================= */

/* CLOSED keeps the original red/cream visual palette for every admin reason.
   Only the illustration/motion changes. */
#v319StorefrontClosed[data-closed-reason="break"],
#v319StorefrontClosed[data-closed-reason="temporary"]{
  background:radial-gradient(circle at 50% 4%,rgba(172,30,34,.10),transparent 32%),var(--bg-page,#f8f5f2)
}
#v319StorefrontClosed[data-closed-reason="break"] .v319-closed-card,
#v319StorefrontClosed[data-closed-reason="temporary"] .v319-closed-card{
  background:linear-gradient(180deg,rgba(255,249,247,.99),rgba(255,255,255,.99));
  border-color:rgba(172,30,34,.13);box-shadow:0 24px 70px rgba(68,35,30,.12)
}
#v319StorefrontClosed[data-closed-reason="break"] .v319-closed-visual,
#v319StorefrontClosed[data-closed-reason="temporary"] .v319-closed-visual{color:#AC1E22}
#v319StorefrontClosed[data-closed-reason="break"] .v319-closed-badge,
#v319StorefrontClosed[data-closed-reason="temporary"] .v319-closed-badge{background:rgba(172,30,34,.08);color:#9f1c20}
#v319StorefrontClosed[data-closed-reason="break"] .v319-closed-badge i,
#v319StorefrontClosed[data-closed-reason="temporary"] .v319-closed-badge i{background:#AC1E22}
#v319StorefrontClosed[data-closed-reason="break"] .v319-closed-channel a,
#v319StorefrontClosed[data-closed-reason="temporary"] .v319-closed-channel a{background:#AC1E22;box-shadow:0 10px 22px rgba(172,30,34,.16)}

.v319-break-face,.v319-break-smile{opacity:.8}
.v319-break-zzz{transform-box:fill-box;transform-origin:center;animation:v1241BreakZzz 3.4s ease-in-out infinite}
.v319-break-steam{opacity:.32;animation:v1241BreakSteam 4.2s ease-in-out infinite}
.v319-closed-graphic--break{animation:v1241BreakCup 4.6s ease-in-out infinite}
.v319-temp-clock{fill:rgba(172,30,34,.035)}
.v319-temp-clock-hand{transform-box:fill-box;transform-origin:bottom center}
.v319-temp-clock-hand--minute{animation:v1241ClockMinute 5.6s linear infinite}
.v319-temp-clock-hand--hour{animation:v1241ClockHour 11.2s linear infinite}
.v319-temp-clock-dot{fill:#AC1E22;stroke:none}
.v319-temp-spark{fill:rgba(172,30,34,.08);stroke:currentColor;stroke-width:2;transform-box:fill-box;transform-origin:center}
.v319-temp-spark--1{animation:v1241Spark 2.8s ease-in-out infinite}.v319-temp-spark--2{animation:v1241Spark 2.8s ease-in-out .7s infinite}
.v319-closed-graphic--temporary{animation:v1241TemporaryFloat 4.8s ease-in-out infinite}

html.dark #v319StorefrontClosed[data-closed-reason="break"],
html.dark #v319StorefrontClosed[data-closed-reason="temporary"]{background:radial-gradient(circle at 50% 4%,rgba(255,120,126,.08),transparent 32%),#171311}
html.dark #v319StorefrontClosed[data-closed-reason="break"] .v319-closed-card,
html.dark #v319StorefrontClosed[data-closed-reason="temporary"] .v319-closed-card{background:linear-gradient(180deg,#251d1b,#211b19);border-color:rgba(255,150,154,.16);box-shadow:0 24px 70px rgba(0,0,0,.34)}
html.dark #v319StorefrontClosed[data-closed-reason="break"] .v319-closed-badge,
html.dark #v319StorefrontClosed[data-closed-reason="temporary"] .v319-closed-badge{background:rgba(255,120,126,.1);color:#ff969a}
html.dark #v319StorefrontClosed[data-closed-reason="break"] .v319-closed-badge i,
html.dark #v319StorefrontClosed[data-closed-reason="temporary"] .v319-closed-badge i{background:#ff7b80}
html.dark #v319StorefrontClosed[data-closed-reason="break"] .v319-closed-channel a,
html.dark #v319StorefrontClosed[data-closed-reason="temporary"] .v319-closed-channel a{background:#c52b30;color:#fff}

/* RESTOCK is a one-time full-screen gate shown above the initial outlet selector.
   After Continue it disappears for the current page session and never floats in catalog. */
.v124-restock-gate{
  position:fixed;inset:0;z-index:20010;display:grid;place-items:center;min-height:100dvh;
  padding:max(20px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  background:radial-gradient(circle at 50% 4%,rgba(172,30,34,.10),transparent 32%),var(--bg-page,#f8f5f2);
  color:var(--text);overflow:auto;overscroll-behavior:none
}
.v124-restock-gate[hidden]{display:none!important}
.v124-restock-gate-card{width:min(100%,420px);animation:v319ClosedEnter .42s cubic-bezier(.2,.8,.2,1) both}
.v124-restock-gate-visual{color:#AC1E22}
.v124-restock-gate-graphic{width:100%;height:100%;overflow:visible;fill:none;stroke:currentColor;stroke-width:2.7;stroke-linecap:round;stroke-linejoin:round}
.v124-restock-crate{fill:rgba(172,30,34,.055)}
.v124-restock-crate-line{opacity:.42}
.v124-restock-crate--1{animation:v1241CrateLeft 3.8s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.v124-restock-crate--2{animation:v1241CrateCenter 3.8s ease-in-out .25s infinite;transform-box:fill-box;transform-origin:center}
.v124-restock-crate--3{animation:v1241CrateRight 3.8s ease-in-out .5s infinite;transform-box:fill-box;transform-origin:center}
.v124-restock-loop{transform-box:fill-box;transform-origin:center;animation:v1241RestockLoop 4s ease-in-out infinite}
.v124-restock-heart{fill:#AC1E22;stroke:none;opacity:.88;transform-box:fill-box;transform-origin:center;animation:v319Heart 3.8s ease-in-out infinite}
.v124-restock-gate-card h2{margin:12px 0 7px;font-size:clamp(27px,8vw,34px);line-height:1.04;letter-spacing:-.04em;text-transform:lowercase}
.v124-restock-gate-card p{max-width:340px;margin:0 auto;color:var(--muted);font-size:13.5px;line-height:1.58}
.v124-restock-gate-card p strong{color:var(--text)}
.v124-restock-gate-policy{display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:"a dot b" "as dot bs";align-items:center;gap:2px 10px;margin-top:18px;padding:12px 13px;border:1px solid rgba(172,30,34,.11);border-radius:16px;background:rgba(172,30,34,.035)}
.v124-restock-gate-policy strong{font-size:11.5px;color:#9f1c20}.v124-restock-gate-policy strong:first-child{grid-area:a}.v124-restock-gate-policy strong:nth-of-type(2){grid-area:b}
.v124-restock-gate-policy span{font-size:9.5px;color:var(--muted);font-weight:700}.v124-restock-gate-policy span:first-of-type{grid-area:as}.v124-restock-gate-policy span:nth-of-type(2){grid-area:bs}
.v124-restock-gate-policy i{grid-area:dot;width:5px;height:30px;border-radius:999px;background:rgba(172,30,34,.12)}
.v124-restock-gate-actions{display:flex;justify-content:center;margin-top:18px}
.v124-restock-gate-actions button{width:100%;min-height:48px;border-radius:15px;padding:0 18px;border:1px solid #AC1E22;background:#AC1E22;color:#fff;font:inherit;font-size:13px;font-weight:850;cursor:pointer;touch-action:manipulation;box-shadow:0 10px 22px rgba(172,30,34,.17)}
.v124-restock-gate-actions button:active{transform:translateY(1px)}
body.is-storefront-restock-gate{overflow:hidden!important;overscroll-behavior:none}
html.dark .v124-restock-gate{background:radial-gradient(circle at 50% 4%,rgba(255,120,126,.08),transparent 32%),#171311}
html.dark .v124-restock-gate-card{background:linear-gradient(180deg,#251d1b,#211b19);border-color:rgba(255,150,154,.16);box-shadow:0 24px 70px rgba(0,0,0,.34)}
html.dark .v124-restock-gate-policy{background:rgba(255,120,126,.035);border-color:rgba(255,150,154,.12)}
html.dark .v124-restock-gate-policy strong{color:#ff969a}

/* Restock reminder inside cart remains visible after the initial gate is dismissed. */
.v124-restock-cart-note{margin:0 0 12px;padding:12px;border:1px solid rgba(172,30,34,.16);border-radius:15px;background:linear-gradient(145deg,rgba(172,30,34,.055),rgba(255,255,255,.72))}.v124-restock-cart-note[hidden]{display:none!important}.v124-restock-cart-head{display:grid;grid-template-columns:30px minmax(0,1fr);gap:9px;align-items:center}.v124-restock-cart-head>span{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:rgba(172,30,34,.08);color:#9f1c20;font-weight:900}.v124-restock-cart-head div{display:grid;gap:2px}.v124-restock-cart-head strong{font-size:11.5px}.v124-restock-cart-head small{color:var(--muted);font-size:10px;line-height:1.35}.v124-restock-progress{height:6px;margin-top:9px;border-radius:999px;background:rgba(172,30,34,.10);overflow:hidden}.v124-restock-progress i{display:block;height:100%;width:0;border-radius:inherit;background:#AC1E22;transition:width .24s ease}.v124-restock-cart-note.is-complete .v124-restock-progress i{background:#35c779}.v124-restock-cart-note button{width:100%;margin-top:9px;min-height:36px;border:1px solid rgba(172,30,34,.20);border-radius:11px;background:transparent;color:#9f1c20;font:inherit;font-size:10px;font-weight:850;cursor:pointer}.v124-restock-cart-note button[hidden]{display:none!important}.v124-restock-cart-note.has-bundle{border-color:rgba(53,199,121,.24);background:rgba(53,199,121,.06)}
html.dark .v124-restock-cart-note{background:rgba(172,30,34,.05)}html.dark .v124-restock-cart-note button{color:#ff969a}

@keyframes v1241BreakZzz{0%,100%{opacity:.24;transform:translate(0,5px) scale(.94)}45%{opacity:.9;transform:translate(2px,-3px) scale(1)}70%{opacity:.18;transform:translate(5px,-7px) scale(.98)}}
@keyframes v1241BreakSteam{0%,100%{opacity:.12;transform:translateY(4px)}45%{opacity:.4;transform:translateY(-4px)}75%{opacity:.04;transform:translateY(-8px)}}
@keyframes v1241BreakCup{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(2px) rotate(-.7deg)}}
@keyframes v1241ClockMinute{to{transform:rotate(360deg)}}
@keyframes v1241ClockHour{to{transform:rotate(360deg)}}
@keyframes v1241Spark{0%,100%{opacity:.18;transform:scale(.72) rotate(0)}50%{opacity:.72;transform:scale(1.04) rotate(10deg)}}
@keyframes v1241TemporaryFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes v1241CrateLeft{0%,100%{transform:translateY(0)}38%{transform:translateY(-5px)}62%{transform:translateY(0)}}
@keyframes v1241CrateCenter{0%,100%{transform:translateY(0)}38%{transform:translateY(4px)}62%{transform:translateY(0)}}
@keyframes v1241CrateRight{0%,100%{transform:translateY(0)}38%{transform:translateY(-4px)}62%{transform:translateY(0)}}
@keyframes v1241RestockLoop{0%,68%,100%{transform:rotate(0);opacity:.45}82%{transform:rotate(10deg);opacity:.9}92%{transform:rotate(-5deg);opacity:.6}}
@media(max-width:359px){.v124-restock-gate-card{padding:24px 16px 18px;border-radius:24px}.v124-restock-gate-card h2{font-size:27px}.v124-restock-gate-card p{font-size:12.5px}}
@media(min-width:430px){.v124-restock-gate-card{padding:34px 26px 24px}.v124-restock-gate-card p{font-size:14px}}
@media(prefers-reduced-motion:reduce){.v319-closed-graphic--break,.v319-break-zzz,.v319-break-steam,.v319-closed-graphic--temporary,.v319-temp-clock-hand,.v319-temp-spark,.v124-restock-gate-card,.v124-restock-crate,.v124-restock-loop,.v124-restock-heart{animation:none!important}.v124-restock-progress i{transition:none!important}}



/* R12.5 — edit cart line + KKM Ramean contextual upsell */
body.kopken-v31 .cart-line-links{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-height:24px}
body.kopken-v31 .cart-edit,body.kopken-v31 .cart-remove{appearance:none;background:none;border:0;padding:2px 0;font:inherit;font-size:11px;font-weight:700;cursor:pointer}
body.kopken-v31 .cart-edit{color:var(--accent,#AC1E22)}
body.kopken-v31 .cart-remove{color:#b91c1c}
body.kopken-v31 .cart-edit:hover{text-decoration:underline}
body.kopken-v31 .cart-remove:hover{text-decoration:underline}
html.dark body.kopken-v31 .cart-edit{color:#ff969a}
html.dark body.kopken-v31 .cart-remove{color:#fb7185}
@media (max-width:520px){body.kopken-v31 .cart-line-links{gap:12px}}