/* ============================================
   OZARK - Reward journey and welcome experience
   ============================================ */
:root {
  --joy-green: #16a34a;
  --joy-green-soft: #ecfdf3;
  --joy-gold: #eab308;
  --joy-gold-soft: #fff9db;
  --joy-ink: #17131f;
  --joy-line: #e6e2ee;
  --joy-shadow: 0 18px 50px rgba(24, 18, 40, .16);
  --joy-spring: cubic-bezier(.18, .89, .32, 1.28);
  --joy-out: cubic-bezier(.22, 1, .36, 1);
}

/* Persistent, visible progress */
.reward-journey {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 850;
  width: min(324px, calc(100vw - 28px));
  color: var(--joy-ink);
  background: #fff;
  border: 1px solid rgba(124, 92, 252, .24);
  border-radius: 8px;
  box-shadow: var(--joy-shadow);
  opacity: 0;
  transform: translateY(18px) scale(.98);
  pointer-events: none;
  transition: opacity .32s var(--joy-out), transform .42s var(--joy-out), border-color .25s ease;
  overflow: hidden;
}
.reward-journey.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.reward-journey.is-complete { border-color: rgba(22, 163, 74, .42); }
.rj-toggle {
  width: 100%;
  min-height: 62px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 52px 14px;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 0;
  background: #fff;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.rj-toggle:focus-visible { outline: 3px solid rgba(124, 92, 252, .32); outline-offset: -3px; }
.rj-emblem {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid #bde7c9;
  border-radius: 8px;
  background: var(--joy-green-soft);
  color: #127336;
  font-size: 14px;
  font-weight: 900;
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.68);
}
.rj-toggle-copy { min-width: 0; display: grid; gap: 2px; }
.rj-toggle-copy strong { font-size: 13px; line-height: 1.2; }
.rj-toggle-copy span { color: #6f687c; font-size: 11px; line-height: 1.2; }
.rj-mini-track {
  height: 5px;
  border-radius: 3px;
  background: #ece9f2;
  overflow: hidden;
}
.rj-mini-track span {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleX(.25);
  transform-origin: left;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--purple), var(--joy-green));
  transition: transform .58s var(--joy-spring);
}
.rj-chevron {
  width: 8px;
  height: 8px;
  border-right: 2px solid #827a90;
  border-bottom: 2px solid #827a90;
  transform: rotate(45deg) translateY(-2px);
  transition: transform .25s var(--joy-out);
}
.reward-journey.is-open .rj-chevron { transform: rotate(225deg) translate(-1px, -1px); }
.rj-panel {
  max-height: 0;
  opacity: 0;
  padding: 0 14px;
  border-top: 1px solid transparent;
  overflow: hidden;
  transition: max-height .46s var(--joy-out), opacity .22s ease, padding .35s var(--joy-out), border-color .2s ease;
}
.reward-journey.is-open .rj-panel {
  max-height: 390px;
  opacity: 1;
  padding: 14px;
  border-top-color: var(--joy-line);
}
.rj-panel-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.rj-panel-head span {
  color: #756d82;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.rj-panel-head strong { color: var(--purple-dark); font-size: 12px; }
.rj-steps { display: grid; gap: 7px; padding: 0; margin: 0; list-style: none; }
.rj-steps li {
  min-width: 0;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  padding: 7px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: #827a8e;
  transition: color .25s ease, background .25s ease, border-color .25s ease, transform .34s var(--joy-out);
}
.rj-step-mark {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid #dfdae8;
  border-radius: 7px;
  background: #f7f5fa;
  color: #877f93;
  font-size: 11px;
  font-weight: 900;
  transition: transform .4s var(--joy-spring), color .25s ease, background .25s ease, border-color .25s ease;
}
.rj-steps li > span:last-child { min-width: 0; display: grid; gap: 1px; }
.rj-steps li strong { font-size: 12px; line-height: 1.2; }
.rj-steps li small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; line-height: 1.25; }
.rj-steps li.is-complete { color: #2f2938; }
.rj-steps li.is-complete .rj-step-mark { border-color: #b7e4c3; background: var(--joy-green-soft); color: #137539; }
.rj-steps li.is-current { border-color: #ddd3ff; background: #f8f6ff; transform: translateX(2px); }
.rj-steps li.is-current .rj-step-mark { transform: scale(1.08); }
.rj-foot { margin: 11px 0 0; color: #827a8e; font-size: 10px; text-align: center; }
.reward-journey.is-updated .rj-emblem { animation: journeyPop .58s var(--joy-spring); }
@keyframes journeyPop {
  0% { transform: scale(.85); }
  55% { transform: scale(1.14) rotate(3deg); }
  100% { transform: scale(1); }
}

/* Milestone feedback */
.reward-toast {
  position: fixed;
  left: 50%;
  bottom: 24px;
  z-index: 860;
  width: min(360px, calc(100vw - 28px));
  min-height: 62px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  padding: 11px 14px;
  border: 1px solid #c9e8d2;
  border-radius: 8px;
  background: #fff;
  color: var(--joy-ink);
  box-shadow: var(--joy-shadow);
  opacity: 0;
  transform: translate(-50%, 18px) scale(.96);
  visibility: hidden;
  pointer-events: none;
  transition: opacity .24s ease, transform .4s var(--joy-spring), visibility .24s ease;
}
.reward-toast.show { opacity: 1; transform: translate(-50%, 0) scale(1); visibility: visible; }
.reward-toast-mark {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--joy-green-soft);
  color: var(--joy-green);
  font-size: 18px;
  font-weight: 900;
}
.reward-toast-copy { min-width: 0; display: grid; gap: 2px; }
.reward-toast-copy strong { font-size: 13px; }
.reward-toast-copy small { color: #6e6779; font-size: 11px; line-height: 1.3; }
.joy-burst {
  position: fixed;
  z-index: 1100;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
.joy-burst span {
  position: absolute;
  left: -3px;
  top: -3px;
  width: 7px;
  height: 7px;
  border-radius: 2px;
  opacity: 0;
  animation: joyBurst .86s var(--joy-out) var(--burst-delay) both;
}
.joy-burst .burst-tone-0 { background: var(--purple); }
.joy-burst .burst-tone-1 { background: var(--joy-green); }
.joy-burst .burst-tone-2 { background: var(--joy-gold); }
.joy-burst .burst-tone-3 { background: #111018; }
@keyframes joyBurst {
  0% { opacity: 0; transform: translate(0, 0) scale(.4) rotate(0); }
  16% { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--burst-x), var(--burst-y)) scale(.75) rotate(var(--burst-r)); }
}

/* Meaningful unlocks inside the existing layout */
.hero-check,
.pnp-step,
.pc-features li,
.step,
.ucard,
.review-card { --reward-delay: calc(var(--reward-order, 0) * 75ms); }
.hero-check.is-rewarded svg { animation: checkSet .48s var(--joy-spring) var(--reward-delay) both; }
.pnp-step.is-rewarded .pnp-step-icon { animation: iconSet .62s var(--joy-spring) var(--reward-delay) both; }
.pc-features li.is-rewarded,
.step.is-rewarded,
.ucard.is-rewarded,
.review-card.is-rewarded { animation: valueSet .56s var(--joy-out) var(--reward-delay) both; }
@keyframes checkSet {
  0% { transform: scale(.65); color: var(--purple); }
  60% { transform: scale(1.18); color: var(--joy-green); }
  100% { transform: scale(1); color: var(--joy-green); }
}
@keyframes iconSet {
  0% { transform: translateY(5px) scale(.86); box-shadow: 0 0 0 0 rgba(124,92,252,.24); }
  60% { transform: translateY(-2px) scale(1.08); box-shadow: 0 0 0 8px rgba(124,92,252,0); }
  100% { transform: translateY(0) scale(1); box-shadow: none; }
}
@keyframes valueSet {
  0% { transform: translateY(5px); filter: saturate(.7); }
  100% { transform: translateY(0); filter: saturate(1); }
}
.faq-confirmed {
  width: max-content;
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 2px 0 10px;
  padding: 4px 7px;
  border: 1px solid #c7ead1;
  border-radius: 5px;
  background: var(--joy-green-soft);
  color: #137539;
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}
.faq-confirmed span { font-size: 11px; }
.checkout-celebrating { animation: checkoutReady .82s var(--joy-spring) both !important; }
@keyframes checkoutReady {
  0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(22,163,74,.28); }
  42% { transform: scale(1.035); box-shadow: 0 0 0 12px rgba(22,163,74,0); }
  100% { transform: scale(1); }
}

/* Positive ending before the footer */
.confidence-finale {
  position: relative;
  width: 100%;
  margin-top: 72px;
  padding: 52px 24px;
  border-top: 1px solid #e2ddeb;
  border-bottom: 1px solid #e2ddeb;
  background: #f8f7fb;
  overflow: hidden;
}
.confidence-finale::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: var(--joy-green);
}
.cf-inner {
  position: relative;
  z-index: 1;
  max-width: 1120px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr) minmax(230px, 310px);
  gap: 24px;
  align-items: center;
}
.cf-mark {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border: 1px solid #a9ddb8;
  border-radius: 8px;
  background: var(--joy-green-soft);
  color: var(--joy-green);
  font-size: 28px;
  font-weight: 900;
  box-shadow: 0 12px 28px rgba(22,163,74,.13);
}
.cf-copy { min-width: 0; }
.cf-kicker {
  margin-bottom: 6px;
  color: #137539;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.cf-copy h2 { margin: 0; color: var(--joy-ink); font-size: 30px; line-height: 1.08; letter-spacing: 0; }
.cf-body { max-width: 620px; margin: 10px 0 0; color: #625b6d; font-size: 14px; line-height: 1.6; }
.cf-assurances { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 14px; }
.cf-assurances span { display: inline-flex; align-items: center; gap: 5px; color: #443d4e; font-size: 11px; font-weight: 750; }
.cf-assurances i { color: var(--joy-green); font-size: 11px; font-style: normal; }
.cf-action { min-width: 0; display: grid; gap: 10px; align-items: center; }
.cf-action .btn-primary,
.cf-action .cf-link { width: 100%; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; text-align: center; text-decoration: none; }
.cf-action small { color: #746d7e; font-size: 10px; line-height: 1.4; text-align: center; }
.cf-secondary-link { color: var(--purple-dark); font-size: 12px; font-weight: 800; text-align: center; text-decoration: none; }
.cf-secondary-link:hover { text-decoration: underline; }
.confidence-finale .cf-mark,
.confidence-finale .cf-copy,
.confidence-finale .cf-action { opacity: 0; transform: translateY(12px); }
.confidence-finale.is-arrived .cf-mark,
.confidence-finale.is-arrived .cf-copy,
.confidence-finale.is-arrived .cf-action { opacity: 1; transform: translateY(0); transition: opacity .5s ease, transform .62s var(--joy-out); }
.confidence-finale.is-arrived .cf-copy { transition-delay: 90ms; }
.confidence-finale.is-arrived .cf-action { transition-delay: 170ms; }

/* Post-purchase welcome */
.welcome-page { min-height: 100%; background: #fff; color: var(--joy-ink); }
.welcome-main { overflow: hidden; }
.welcome-hero {
  position: relative;
  min-height: 470px;
  display: grid;
  place-items: center;
  padding: 64px 24px 54px;
  border-bottom: 1px solid var(--joy-line);
  background: #fff;
  text-align: center;
  overflow: hidden;
}
.welcome-hero::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 5px;
  background: linear-gradient(90deg, var(--purple), var(--joy-green), var(--joy-gold));
}
.welcome-hero-inner { position: relative; z-index: 2; width: min(760px, 100%); }
.welcome-logo-mark {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  margin: 0 auto 18px;
  border: 1px solid #d8d1ec;
  border-radius: 8px;
  background: #f8f6ff;
  box-shadow: 0 16px 38px rgba(124,92,252,.14);
}
.welcome-logo-mark img { width: 48px; height: 48px; object-fit: contain; }
.welcome-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 14px;
  color: #137539;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.welcome-kicker span { width: 8px; height: 8px; border-radius: 2px; background: var(--joy-green); box-shadow: 0 0 0 5px rgba(22,163,74,.11); }
.welcome-hero h1 { margin: 0; color: #15111c; font-size: 48px; line-height: 1.03; letter-spacing: 0; }
.welcome-hero h1 em { color: var(--purple); font-style: normal; }
.welcome-lede { max-width: 640px; margin: 18px auto 0; color: #635c6f; font-size: 17px; line-height: 1.6; }
.welcome-statuses { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; margin-top: 24px; }
.welcome-statuses span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  border: 1px solid var(--joy-line);
  border-radius: 6px;
  background: #fff;
  color: #4f4759;
  font-size: 11px;
  font-weight: 800;
}
.welcome-statuses i { color: var(--joy-green); font-style: normal; }
.welcome-start { margin-top: 26px; min-width: 180px; text-decoration: none; }
.welcome-product-row { display: flex; justify-content: center; gap: 8px; margin-top: 28px; }
.welcome-product-row img {
  width: 58px;
  height: 58px;
  object-fit: contain;
  border: 1px solid #e4dfeb;
  border-radius: 7px;
  background: #faf9fc;
  padding: 5px;
}
.welcome-product-row img.is-selected { border-color: #b8a8f5; background: #f5f2ff; box-shadow: 0 10px 24px rgba(124,92,252,.13); transform: translateY(-4px); }
.welcome-setup { padding: 72px 24px; background: #f8f7fb; }
.welcome-setup-inner { max-width: 960px; margin: 0 auto; }
.welcome-section-head { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 24px; align-items: end; margin-bottom: 26px; }
.welcome-section-head .eyebrow { color: var(--purple-dark); font-size: 10px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.welcome-section-head h2 { margin: 6px 0 0; font-size: 30px; line-height: 1.1; letter-spacing: 0; }
.welcome-section-head p { max-width: 580px; margin: 9px 0 0; color: #696170; font-size: 14px; line-height: 1.6; }
.welcome-progress { width: 170px; }
.welcome-progress-head { display: flex; justify-content: space-between; margin-bottom: 7px; color: #665e70; font-size: 10px; font-weight: 800; }
.welcome-progress-track { height: 8px; border-radius: 4px; background: #e4e0e9; overflow: hidden; }
.welcome-progress-track span { display: block; width: 100%; height: 100%; transform: scaleX(0); transform-origin: left; background: linear-gradient(90deg, var(--purple), var(--joy-green)); transition: transform .55s var(--joy-spring); }
.welcome-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.welcome-step {
  position: relative;
  min-width: 0;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 20px;
  border: 1px solid #ddd8e5;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  transition: border-color .25s ease, box-shadow .25s ease, transform .35s var(--joy-out), background .25s ease;
}
.welcome-step:hover { transform: translateY(-3px); border-color: #c9bdf3; box-shadow: 0 14px 30px rgba(37,28,57,.08); }
.welcome-step input {
  appearance: none;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  margin: 0;
  border: 2px solid #cfc8da;
  border-radius: 7px;
  background: #f8f7fa;
  cursor: pointer;
  transition: transform .35s var(--joy-spring), border-color .2s ease, background .2s ease;
}
.welcome-step input::after { content: '\2713'; color: #fff; font-size: 17px; font-weight: 900; opacity: 0; transform: scale(.6); transition: opacity .2s ease, transform .35s var(--joy-spring); }
.welcome-step input:checked { border-color: var(--joy-green); background: var(--joy-green); transform: scale(1.06); }
.welcome-step input:checked::after { opacity: 1; transform: scale(1); }
.welcome-step:has(input:checked) { border-color: #afe0bd; background: #fbfffc; }
.welcome-step-copy { min-width: 0; display: grid; gap: 5px; }
.welcome-step-copy strong { font-size: 14px; line-height: 1.25; }
.welcome-step-copy span { color: #6b6374; font-size: 11px; line-height: 1.5; }
.welcome-complete {
  margin-top: 18px;
  padding: 18px 20px;
  border: 1px solid #afe0bd;
  border-radius: 8px;
  background: var(--joy-green-soft);
  color: #155f32;
  text-align: center;
}
.welcome-complete strong { display: block; margin-bottom: 3px; font-size: 15px; }
.welcome-complete span { font-size: 12px; }
.welcome-support { padding: 64px 24px; background: #15121b; color: #fff; }
.welcome-support-inner { max-width: 960px; margin: 0 auto; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 28px; align-items: center; }
.welcome-support .eyebrow { color: #b7a6ff; font-size: 10px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.welcome-support h2 { margin: 7px 0 0; font-size: 30px; line-height: 1.1; letter-spacing: 0; }
.welcome-support p { max-width: 620px; margin: 10px 0 0; color: #c7c0d0; font-size: 14px; line-height: 1.6; }
.welcome-support .btn-secondary { border-color: #6e637d; background: #fff; color: #17131f; white-space: nowrap; }
.welcome-confetti { position: fixed; inset: 0; z-index: 1000; pointer-events: none; overflow: hidden; }
.welcome-confetti span {
  position: absolute;
  top: -16px;
  width: 8px;
  height: 14px;
  border-radius: 2px;
  opacity: 0;
  animation: welcomeFall var(--fall-duration) var(--joy-out) var(--fall-delay) both;
}
@keyframes welcomeFall {
  0% { opacity: 0; transform: translate3d(0,-20px,0) rotate(0); }
  12% { opacity: 1; }
  100% { opacity: 0; transform: translate3d(var(--fall-x), 105vh, 0) rotate(var(--fall-r)); }
}

@media (max-width: 840px) {
  .cf-inner { grid-template-columns: 52px minmax(0, 1fr); }
  .cf-action { grid-column: 2; max-width: 360px; }
  .welcome-steps { grid-template-columns: 1fr; }
  .welcome-section-head { grid-template-columns: 1fr; align-items: start; }
  .welcome-progress { width: 100%; }
}

@media (max-width: 620px) {
  .reward-journey {
    right: 14px;
    bottom: 14px;
    width: 176px;
    transition: width .3s var(--joy-out), opacity .32s var(--joy-out), transform .42s var(--joy-out), border-color .25s ease;
  }
  .reward-journey.is-open { width: calc(100vw - 28px); }
  .rj-toggle { min-height: 50px; grid-template-columns: 32px minmax(0,1fr) 12px; gap: 7px; padding: 7px 9px; }
  .rj-emblem { width: 32px; height: 32px; font-size: 12px; }
  .rj-toggle-copy strong { font-size: 11px; }
  .rj-toggle-copy span { font-size: 9px; }
  .rj-mini-track { display: none; }
  .reward-toast { bottom: 88px; }
  .confidence-finale { margin-top: 52px; padding: 40px 20px; }
  .cf-inner { grid-template-columns: 1fr; gap: 17px; }
  .cf-mark { width: 48px; height: 48px; font-size: 22px; }
  .cf-copy h2 { font-size: 25px; }
  .cf-action { grid-column: 1; max-width: none; }
  .welcome-hero { min-height: 480px; padding: 48px 20px 42px; }
  .welcome-logo-mark { width: 62px; height: 62px; }
  .welcome-logo-mark img { width: 42px; height: 42px; }
  .welcome-hero h1 { font-size: 37px; }
  .welcome-lede { font-size: 15px; }
  .welcome-product-row img { width: 50px; height: 50px; }
  .welcome-setup { padding: 54px 20px; }
  .welcome-section-head h2,
  .welcome-support h2 { font-size: 25px; }
  .welcome-support { padding: 50px 20px; }
  .welcome-support-inner { grid-template-columns: 1fr; }
  .welcome-support .btn-secondary { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .reward-journey,
  .rj-panel,
  .rj-mini-track span,
  .rj-step-mark,
  .rj-steps li,
  .reward-toast,
  .confidence-finale .cf-mark,
  .confidence-finale .cf-copy,
  .confidence-finale .cf-action,
  .welcome-progress-track span,
  .welcome-step,
  .welcome-step input,
  .welcome-step input::after { transition: none !important; }
  .reward-journey.is-updated .rj-emblem,
  .hero-check.is-rewarded svg,
  .pnp-step.is-rewarded .pnp-step-icon,
  .pc-features li.is-rewarded,
  .step.is-rewarded,
  .ucard.is-rewarded,
  .review-card.is-rewarded,
  .checkout-celebrating,
  .welcome-confetti span { animation: none !important; }
  .joy-burst,
  .welcome-confetti { display: none !important; }
  .confidence-finale .cf-mark,
  .confidence-finale .cf-copy,
  .confidence-finale .cf-action { opacity: 1; transform: none; }
}

/* Premium finish for the reward and post-purchase journey */
:root {
  --joy-green: #1e9b60;
  --joy-green-soft: #effaf4;
  --joy-gold: #b58a16;
  --joy-gold-soft: #f8f4e8;
  --joy-ink: #211a2d;
  --joy-line: #e6e1eb;
  --joy-shadow: 0 2px 5px rgba(53, 42, 70, .05), 0 20px 50px rgba(71, 53, 102, .1);
  --joy-spring: cubic-bezier(.2, .82, .28, 1.04);
  --joy-out: cubic-bezier(.2, .8, .2, 1);
}

.reward-journey {
  width: min(306px, calc(100vw - 28px));
  border-color: #e1dbe8;
  background: rgba(255, 255, 255, .98);
  box-shadow: var(--joy-shadow);
  backdrop-filter: blur(18px);
}
.reward-journey.is-complete { border-color: #b8d7c5; }
.rj-toggle { background: transparent; }
.rj-emblem,
.rj-step-mark,
.reward-toast-mark,
.cf-mark,
.welcome-logo-mark { border-radius: 6px; }
.rj-emblem { border-color: #c9dfd2; background: #f0f7f3; color: #176b43; box-shadow: none; }
.rj-mini-track { background: #e8e5ea; }
.rj-mini-track span { background: #765fe8; }
.rj-panel { border-top-color: transparent; }
.reward-journey.is-open .rj-panel { border-top-color: #e4e1e6; }
.rj-steps li { border-radius: 6px; }
.rj-steps li.is-current { border-color: #ddd5ed; background: #f8f5fd; transform: translateX(1px); }
.rj-steps li.is-complete .rj-step-mark { border-color: #c5ddce; background: #f0f7f3; color: #176b43; }
.reward-toast { border-color: #c9ddd1; background: #fdfdfd; box-shadow: var(--joy-shadow); }
.reward-toast-mark { background: #eef7f2; color: #168a51; }
.checkout-celebrating { animation-duration: .68s !important; }

.confidence-finale {
  border-color: #e5e0eb;
  background: #f8f7fc;
}
.confidence-finale::before { width: 3px; background: #168a51; }
.cf-mark {
  border-color: #bdd8c8;
  background: #eef7f2;
  color: #168a51;
  box-shadow: 0 8px 22px rgba(22,138,81,.1);
}
.cf-copy h2 { color: #211a2d; }
.cf-kicker { color: #176b43; letter-spacing: 0; }
.cf-secondary-link { color: #5d46ca; }

.welcome-page { background: #fff; }
.welcome-hero { border-bottom-color: #e5e0eb; background: #fff; }
.welcome-hero::before { height: 3px; background: #765fe8; }
.welcome-logo-mark {
  border-color: #d8d3df;
  background: #f8f5fd;
  box-shadow: 0 2px 5px rgba(23,21,27,.05), 0 16px 34px rgba(79,59,173,.1);
}
.welcome-kicker { color: #176b43; letter-spacing: 0; }
.welcome-hero h1 { color: #211a2d; }
.welcome-hero h1 em { color: #765fe8; }
.welcome-statuses span {
  border-color: #dedbe2;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(23,21,27,.025);
}
.welcome-start { width: auto; }
.welcome-product-row img {
  border-color: #dfdce2;
  border-radius: 6px;
  background: #f8f7f9;
}
.welcome-product-row img.is-selected {
  border-color: #bdb4dd;
  background: #f2eff8;
  box-shadow: 0 8px 20px rgba(79,59,173,.1);
}
.welcome-setup { background: #f8f7fc; }
.welcome-progress-track { background: #dfdce2; }
.welcome-progress-track span { background: #765fe8; }
.welcome-step {
  border-color: #ddd9e0;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(23,21,27,.035), 0 8px 24px rgba(23,21,27,.035);
}
.welcome-step:hover {
  transform: translateY(-2px);
  border-color: #c7c1cc;
  box-shadow: 0 2px 5px rgba(23,21,27,.05), 0 16px 32px rgba(23,21,27,.07);
}
.welcome-step input { border-radius: 5px; background: #f5f4f6; }
.welcome-step:has(input:checked) { border-color: #b9d8c5; background: #fbfdfc; }
.welcome-complete { border-color: #b9d8c5; border-radius: 7px; background: #eef7f2; color: #195d3c; }
.welcome-support { background: linear-gradient(135deg, #7d68e9 0%, #654fd4 100%); }
.welcome-support .btn-secondary { border-color: #fff; background: #fff; color: #211a2d; }

/* Keep reward and welcome surfaces in sync with the white/cobalt palette. */
:root {
  --joy-green: #007f61;
  --joy-green-soft: #e2fbf2;
  --joy-gold: #e5a511;
  --joy-gold-soft: #fff3cc;
  --joy-ink: #1d2230;
  --joy-line: #dfe5f0;
  --joy-shadow: 0 2px 5px rgba(29,34,48,.06), 0 20px 50px rgba(46,63,98,.14);
}
.reward-journey { border-color: #cfd8ee; }
.rj-toggle:focus-visible { outline-color: rgba(65,90,244,.42); }
.rj-mini-track span,
.welcome-hero::before,
.welcome-progress-track span { background: var(--purple); }
.rj-steps li.is-current {
  border-color: #b7c4f0;
  background: #edf1ff;
}
.cf-secondary-link,
.welcome-hero h1 em { color: var(--purple-dark); }
.confidence-finale,
.welcome-setup { background: #f6f8fd; }
.welcome-hero { border-bottom-color: #dfe5f0; }
.welcome-logo-mark {
  border-color: #cfd8ee;
  background: #edf1ff;
  box-shadow: 0 2px 5px rgba(29,34,48,.06), 0 16px 34px rgba(65,90,244,.15);
}
.welcome-product-row img.is-selected {
  border-color: #9faef0;
  background: #e9eeff;
  box-shadow: 0 8px 20px rgba(65,90,244,.16);
}
.welcome-support { background: linear-gradient(135deg, #526cf8 0%, #3047c7 100%); }

/* Programmer-aware build panel */
:root {
  --joy-cobalt: #415af4;
  --joy-green: #007f61;
  --joy-green-soft: #e7f8f2;
  --joy-gold: #a36a00;
  --joy-ink: #1d2230;
  --joy-line: #dfe5f0;
  --joy-shadow: 0 3px 10px rgba(29, 34, 48, .07), 0 18px 44px rgba(46, 63, 98, .13);
}
.reward-journey {
  width: min(244px, calc(100vw - 28px));
  border-color: #cfd8ee;
  color: var(--joy-ink);
  background: #fff;
  backdrop-filter: none;
  transition: width .28s var(--joy-out), opacity .32s var(--joy-out), transform .42s var(--joy-out), border-color .25s ease;
}
.reward-journey.is-open { width: min(320px, calc(100vw - 28px)); }
.reward-journey.is-complete { border-color: #91cdb7; }
.rj-toggle {
  min-height: 58px;
  grid-template-columns: 36px minmax(0, 1fr) 12px;
  gap: 9px;
  padding: 9px 11px;
}
.rj-emblem {
  width: 36px;
  height: 36px;
  border-color: #bbc7f5;
  border-radius: 7px;
  color: #3047c7;
  background: #edf1ff;
  font-size: 10px;
  letter-spacing: 0;
}
.reward-journey.is-complete .rj-emblem {
  border-color: #a7d8c5;
  color: #006a50;
  background: #e7f8f2;
}
.rj-toggle-copy strong { color: #1d2230; font-size: 12px; }
.rj-toggle-copy span {
  overflow: hidden;
  color: #65708a;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rj-mini-track { display: none; height: 4px; background: #e4e8f2; }
.rj-mini-track span { background: var(--joy-cobalt); }
.reward-journey.is-complete .rj-mini-track span { background: var(--joy-green); }
.reward-journey.is-open .rj-panel {
  max-height: 520px;
  padding: 13px 14px 14px;
  border-top-color: #e4e8f1;
}
.rj-panel-head { margin-bottom: 10px; }
.rj-panel-head span { color: #69728a; letter-spacing: .06em; }
.rj-panel-head strong { color: var(--joy-cobalt); }
.rj-build-summary {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  margin-bottom: 9px;
  padding: 9px 10px;
  border: 1px solid #dce3f1;
  border-radius: 7px;
  background: #f8f9fd;
}
.rj-build-summary[hidden],
.rj-build-values[hidden] { display: none; }
.rj-build-badge {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 6px;
  color: #fff;
  background: var(--joy-cobalt);
  font-size: 9px;
  font-weight: 900;
}
.rj-build-copy { min-width: 0; display: grid; gap: 1px; }
.rj-build-copy small {
  color: #788199;
  font-size: 8px;
  font-weight: 800;
  text-transform: uppercase;
}
.rj-build-copy strong {
  overflow: hidden;
  color: #202536;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rj-build-copy code { color: #65708a; font: 8px/1.3 ui-monospace, SFMono-Regular, Consolas, monospace; }
.rj-build-values {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 9px;
  border: 1px solid #dfe5f0;
  border-radius: 7px;
  background: #fff;
  overflow: hidden;
}
.rj-build-values > span {
  min-width: 0;
  display: grid;
  gap: 2px;
  padding: 8px 7px;
  border-right: 1px solid #e5e9f1;
}
.rj-build-values > span:last-child { border-right: 0; }
.rj-build-values small {
  overflow: hidden;
  color: #7b849a;
  font-size: 7px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rj-build-values strong { color: #2c3346; font-size: 9px; }
.rj-steps { gap: 0; }
.rj-steps li,
.rj-steps li.is-current {
  min-height: 39px;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 9px;
  padding: 6px 2px;
  border: 0;
  border-top: 1px solid #edf0f5;
  border-radius: 0;
  background: transparent;
  color: #727b91;
  transform: none;
}
.rj-steps li:first-child { border-top: 0; }
.rj-step-mark {
  width: 24px;
  height: 24px;
  border-color: #d5dbe7;
  border-radius: 6px;
  background: #f5f7fa;
  color: #7e8799;
  font-size: 9px;
}
.rj-steps li.is-complete { color: #293044; }
.rj-steps li.is-complete .rj-step-mark {
  border-color: #acd9c8;
  color: #006f54;
  background: #e7f8f2;
}
.rj-steps li.is-current { color: #293044; }
.rj-steps li.is-current .rj-step-mark {
  border-color: #aebbf2;
  color: #3047c7;
  background: #edf1ff;
  transform: none;
}
.rj-steps li strong { font-size: 11px; }
.rj-steps li small { color: #7b8498; font-size: 9px; }
.rj-action {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 10px;
  border-radius: 7px;
  color: #fff;
  background: var(--joy-cobalt);
  font-size: 11px;
  font-weight: 850;
  transition: background .18s ease, transform .18s ease;
}
.rj-action:hover { color: #fff; background: #3047c7; transform: translateY(-1px); }
.rj-action:focus-visible { outline: 2px solid #91a0f1; outline-offset: 2px; }
.rj-foot { margin-top: 9px; color: #7b8498; font-size: 8.5px; }

@media (max-width: 620px) {
  .reward-journey { width: 188px; }
  .reward-journey.is-open { width: calc(100vw - 28px); }
  .rj-toggle { min-height: 50px; grid-template-columns: 32px minmax(0, 1fr) 12px; padding: 7px 9px; }
  .rj-emblem { width: 32px; height: 32px; }
  .rj-toggle-copy strong { font-size: 10.5px; }
  .rj-toggle-copy span { font-size: 8.5px; }
  .rj-mini-track { display: none; }
  .reward-journey.is-open .rj-panel { max-height: min(520px, calc(100vh - 84px)); overflow-y: auto; }
}

/* Match the violet technical storefront palette. */
:root {
  --joy-cobalt: #6847ff;
  --joy-green: #00a875;
  --joy-green-soft: #effaf6;
  --joy-gold: #d8a400;
  --joy-ink: #11121a;
  --joy-line: #e1dce9;
  --joy-shadow: 0 4px 12px rgba(29, 23, 47, .06), 0 20px 48px rgba(68, 51, 118, .11);
}
.reward-journey { border-color: #d8d2e4; }
.reward-journey.is-complete { border-color: #9edcc7; }
.rj-emblem {
  border-color: #cfc5ff;
  color: #6847ff;
  background: #eee9ff;
}
.reward-journey.is-complete .rj-emblem {
  border-color: #a9ddca;
  color: #007f59;
  background: #effaf6;
}
.rj-toggle-copy strong,
.rj-build-copy strong,
.rj-steps li.is-current { color: #11121a; }
.rj-panel-head strong { color: #6847ff; }
.rj-build-summary,
.rj-build-values { border-color: #ded9e8; background: #fbfaff; }
.rj-build-badge,
.rj-action { background: #6847ff; }
.rj-action:hover { background: #5336e8; }
.rj-steps li.is-current .rj-step-mark {
  border-color: #b9adff;
  color: #6847ff;
  background: #eee9ff;
}
.rj-steps li.is-complete .rj-step-mark {
  border-color: #a9ddca;
  color: #007f59;
  background: #effaf6;
}
.confidence-finale { border-color: #e1dce9; background: #f8f6ff; }
.cf-secondary-link { color: #5336e8; }
.welcome-hero,
.welcome-setup {
  background-color: #fff;
  background-image:
    linear-gradient(#eff0f5 1px, transparent 1px),
    linear-gradient(90deg, #eff0f5 1px, transparent 1px);
  background-size: 46px 46px;
}
.welcome-hero::before,
.welcome-progress-track span { background: #6847ff; }
.welcome-logo-mark,
.welcome-product-row img.is-selected {
  border-color: #cfc5ff;
  background: #eee9ff;
}
.welcome-hero h1 em { color: #6847ff; }
.welcome-support { background: #14121c; }

/* Persistent storefront cart */
.store-cart {
  --sc-accent: #087ca7;
  --sc-spring: cubic-bezier(.16, 1, .3, 1);
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 2180;
  width: 226px;
  color: #102832;
  opacity: 0;
  transform: translateY(14px) scale(.97);
  transform-origin: right bottom;
  filter: drop-shadow(0 22px 38px rgba(16, 40, 50, .08));
  transition: width .42s var(--sc-spring), opacity .24s ease, transform .42s var(--sc-spring);
}
.store-cart.is-visible { opacity: 1; transform: none; }
.store-cart.is-open { width: min(390px, calc(100vw - 40px)); }
body:has(.store-cart.is-open) #assistantSideLauncher,
body.store-cart-open #assistantSideLauncher {
  opacity: 0 !important;
  pointer-events: none !important;
}
.sc-toggle,
.sc-panel {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .88);
  background:
    radial-gradient(circle at 14% -18%, rgba(255,255,255,.98), transparent 42%),
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(243,252,255,.86) 56%, rgba(203,241,250,.8)),
    rgba(238,250,253,.9);
  box-shadow:
    inset 0 1px 0 #fff,
    inset 0 -1px 0 rgba(8,124,167,.13),
    inset 1px 0 0 rgba(255,255,255,.55),
    0 22px 58px rgba(16,40,50,.16),
    0 2px 7px rgba(8,124,167,.08);
  -webkit-backdrop-filter: blur(28px) saturate(1.55) contrast(1.03);
  backdrop-filter: blur(28px) saturate(1.55) contrast(1.03);
}
.sc-toggle::before,
.sc-panel::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 1px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(115deg, rgba(255,255,255,.66), transparent 28%, transparent 70%, rgba(144,221,243,.2));
  opacity: .9;
}
.sc-toggle > *,
.sc-panel > * {
  position: relative;
  z-index: 1;
}
.sc-toggle {
  width: 100%;
  min-height: 58px;
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) 12px;
  align-items: center;
  gap: 11px;
  padding: 9px 12px;
  border-radius: 8px;
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color .2s ease, box-shadow .36s ease, transform .42s var(--sc-spring);
}
.sc-toggle:hover {
  border-color: rgba(144,221,243,.9);
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(8,124,167,.13), 0 25px 58px rgba(8,124,167,.18);
  transform: translateY(-2px);
}
.sc-toggle:focus-visible,
.sc-panel button:focus-visible { outline: 3px solid rgba(25,168,209,.28); outline-offset: 2px; }
.sc-bag {
  position: relative;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(8,124,167,.24);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.94), rgba(218,246,252,.66)),
    rgba(243,252,255,.76);
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(8,124,167,.1), 0 8px 18px rgba(8,124,167,.13);
  -webkit-backdrop-filter: blur(14px) saturate(1.35);
  backdrop-filter: blur(14px) saturate(1.35);
}
.sc-bag svg { width: 21px; height: 21px; fill: none; stroke: var(--sc-accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sc-badge {
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  padding: 0 5px;
  border: 2px solid #fff;
  border-radius: 9px;
  color: #fff;
  background: #087ca7;
  font-size: 9px;
  font-weight: 900;
}
.sc-toggle-copy { min-width: 0; display: grid; gap: 2px; }
.sc-toggle-copy strong { color: #102832; font-size: 13px; line-height: 1.15; }
.sc-toggle-copy span { overflow: hidden; color: #60737c; font-size: 10px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.sc-chevron {
  width: 8px;
  height: 8px;
  border-right: 1.5px solid #56717c;
  border-bottom: 1.5px solid #56717c;
  transform: rotate(225deg) translate(-1px,-1px);
  transition: transform .3s cubic-bezier(.2,.8,.2,1);
}
.store-cart.is-open .sc-chevron { transform: rotate(45deg) translate(-1px,-1px); }
.sc-panel {
  position: absolute;
  right: 0;
  bottom: calc(100% + 10px);
  width: 100%;
  max-height: min(560px, calc(100dvh - 110px - env(safe-area-inset-bottom)));
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 8px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px) scale(.97);
  transform-origin: right bottom;
  transition: opacity .22s ease, transform .46s var(--sc-spring);
}
.store-cart.is-open .sc-panel { opacity: 1; pointer-events: auto; transform: none; }
.sc-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  border-bottom: 1px solid rgba(8,124,167,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,.08));
}
.sc-panel-head > span { display: grid; gap: 3px; }
.sc-panel-head small { color: #087ca7; font-size: 8px; font-weight: 850; text-transform: uppercase; }
.sc-panel-head strong { color: #102832; font-size: 16px; line-height: 1.15; }
.sc-close {
  width: 32px;
  height: 32px;
  border: 1px solid rgba(8,124,167,.18);
  border-radius: 8px;
  color: #35505b;
  background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(224,246,252,.58));
  box-shadow: inset 0 1px 0 #fff, 0 5px 14px rgba(8,124,167,.08);
  -webkit-backdrop-filter: blur(14px) saturate(1.35);
  backdrop-filter: blur(14px) saturate(1.35);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
.sc-empty { padding: 30px 22px 24px; text-align: center; }
.sc-empty-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  margin: 0 auto 12px;
  border: 1px solid rgba(8,124,167,.2);
  border-radius: 8px;
  color: #087ca7;
  background: rgba(243,252,255,.78);
  font-size: 22px;
  box-shadow: inset 0 1px 0 #fff;
}
.sc-empty strong { display: block; color: #102832; font-size: 14px; }
.sc-empty p { max-width: 260px; margin: 7px auto 16px; color: #687982; font-size: 11px; line-height: 1.5; }
.sc-browse,
.sc-checkout,
.sc-item-resume {
  border: 0;
  border-radius: 7px;
  cursor: pointer;
  font: 800 11px/1.2 inherit;
}
.sc-browse {
  min-height: 36px;
  padding: 0 16px;
  color: #075e80;
  border: 1px solid rgba(8,124,167,.2);
  background: linear-gradient(145deg, rgba(255,255,255,.86), rgba(144,221,243,.24));
  box-shadow: inset 0 1px 0 #fff, 0 7px 17px rgba(8,124,167,.09);
  -webkit-backdrop-filter: blur(14px) saturate(1.35);
  backdrop-filter: blur(14px) saturate(1.35);
}
.sc-filled { padding: 0 16px 15px; }
.sc-items { display: grid; }
.sc-item {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) auto auto 28px;
  align-items: center;
  gap: 9px;
  padding: 13px 0;
  border-bottom: 1px solid rgba(8,124,167,.12);
  background: linear-gradient(90deg, rgba(255,255,255,.42), rgba(243,252,255,.12) 78%, transparent);
}
.sc-item-mark {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(8,124,167,.2);
  border-radius: 8px;
  color: #087ca7;
  background: #eefaff;
  font-size: 9px;
  font-weight: 900;
}
.sc-item.is-basketball .sc-item-mark { border-color: #f3a6c4; color: #c61f69; background: #fff0f6; }
.sc-item.is-shooters .sc-item-mark { border-color: #a8dfc2; color: #007d4d; background: #effbf5; }
.sc-item.is-aim .sc-item-mark { border-color: #efb8dd; color: #a82e84; background: #fff2fb; }
.sc-item-copy { min-width: 0; display: grid; gap: 2px; }
.sc-item-copy strong { overflow: hidden; color: #102832; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.sc-item-copy small { color: #74858d; font-size: 8px; }
.sc-item-price { color: #102832; font-size: 11px; }
.sc-item-resume {
  min-height: 30px;
  padding: 0 10px;
  color: #075e80;
  border: 1px solid rgba(8,124,167,.2);
  background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(224,246,252,.62));
  box-shadow: inset 0 1px 0 #fff, 0 6px 14px rgba(8,124,167,.08);
  -webkit-backdrop-filter: blur(12px) saturate(1.3);
  backdrop-filter: blur(12px) saturate(1.3);
}
.sc-item-remove { width: 28px; height: 28px; border: 0; color: #788a92; background: transparent; font-size: 18px; cursor: pointer; }
.sc-summary { display: flex; align-items: baseline; justify-content: space-between; padding: 14px 0 12px; color: #60747d; font-size: 11px; }
.sc-summary strong { color: #102832; font-size: 18px; }
.sc-checkout {
  width: 100%;
  min-height: 42px;
  color: #fff;
  border: 1px solid rgba(255,255,255,.52);
  background: linear-gradient(135deg, #087ca7, #19a8d1 58%, #087ca7);
  box-shadow: 0 12px 26px rgba(8,124,167,.24), inset 0 1px 0 rgba(255,255,255,.42), inset 0 -1px 0 rgba(0,61,86,.18);
  transition: transform .34s var(--sc-spring), box-shadow .28s ease;
}
.sc-checkout:hover { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(8,124,167,.27), inset 0 1px 0 rgba(255,255,255,.32); }
.sc-browse,
.sc-close,
.sc-item-resume {
  transition: transform .32s var(--sc-spring), border-color .18s ease, box-shadow .26s var(--sc-spring);
}
.sc-browse:hover,
.sc-close:hover,
.sc-item-resume:hover {
  border-color: rgba(25,168,209,.5);
  box-shadow: inset 0 1px 0 #fff, 0 10px 22px rgba(8,124,167,.14);
  transform: translateY(-1px);
}
.sc-browse:active,
.sc-close:active,
.sc-item-resume:active { transform: scale(.97); }
.sc-foot { margin: 9px 0 0; color: #7a8a91; font-size: 8.5px; text-align: center; }

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .sc-toggle,
  .sc-panel { background: rgba(243,252,255,.97); }
}

@media (max-width: 620px) {
  .store-cart {
    right: max(12px, env(safe-area-inset-right));
    bottom: max(12px, calc(10px + env(safe-area-inset-bottom)));
    width: 54px;
  }
  body.product-page.mobile-purchase-visible .store-cart {
    bottom: max(82px, calc(78px + env(safe-area-inset-bottom)));
  }
  .store-cart.is-empty:not(.is-open) {
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px) scale(.94);
  }
  .store-cart.is-open { width: min(390px, calc(100% - 24px)); }
  .store-cart:not(.is-open) .sc-toggle {
    width: 54px;
    min-height: 54px;
    grid-template-columns: 1fr;
    gap: 0;
    padding: 7px;
    border-radius: 14px;
  }
  .store-cart:not(.is-open) .sc-toggle-copy,
  .store-cart:not(.is-open) .sc-chevron { display: none; }
  .sc-item { grid-template-columns: 36px minmax(0,1fr) auto 44px; }
  .sc-item-price { display: none; }
  .sc-close,
  .sc-item-remove { width: 44px; height: 44px; }
  .sc-browse,
  .sc-checkout,
  .sc-item-resume { min-height: 44px; }
  .sc-item-resume { padding: 0 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .store-cart,
  .sc-toggle,
  .sc-panel,
  .sc-chevron,
  .sc-checkout,
  .sc-browse,
  .sc-close,
  .sc-item-resume { transition: none !important; }
}