.bottom-nav.has-cart.has-gift.has-promotion {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.bottom-nav.has-promotion .bottom-link {
  min-width: 0;
  white-space: nowrap;
}

html.promotion-document { min-width: 0; scroll-behavior: smooth; }
body.promotion-page { min-width: 0; background: #fff; color: #5e4127; letter-spacing: 0; }
.promotion-page .site-frame { background: #fff; }
.promotion-page .promotion-brand-title {
  flex-direction: column;
  align-items: center;
  gap: 5px;
  margin-bottom: 0;
  padding-bottom: 12px;
  color: #5e4127;
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.35;
  white-space: normal;
}
.promotion-brand-en { font-family: Georgia, "Times New Roman", serif; font-size: 10px; font-weight: 400; line-height: 1.4; }
.promotion-page .promotion-section-heading { min-height: 40px; padding-inline: 16px; }
.promotion-main { padding: 0 0 24px; }
.promotion-closed { min-height: 60vh; padding: 80px 24px; text-align: center; }
.promotion-closed h1 { font-size: 22px; }
.promotion-campaign {
  background: #fff8e9 url("../assets/promotion/double11-background.webp") center / cover;
  border-bottom: 1px solid #e6d6b6;
}
.promotion-intro { padding: 24px 12px 0; text-align: center; }
.promotion-intro h1 { margin: 0; color: #a62c36; font-size: 36px; font-weight: 700; line-height: 1.4; }
.promotion-intro p { margin: 10px 0 0; color: #5e4127; font-size: 12px; line-height: 1.7; }
.promotion-scene { position: relative; margin-top: 14px; overflow: hidden; isolation: isolate; }
.promotion-portrait {
  position: absolute;
  z-index: -1;
  left: 0;
  bottom: 0;
  display: block;
  width: 54%;
  height: auto;
  aspect-ratio: 760 / 885;
  pointer-events: none;
}
.promotion-tiers { display: grid; grid-template-columns: minmax(0, 1fr); margin-left: 55%; padding: 0 12px 18px 0; }
.promotion-tier { min-width: 0; padding: 12px 0 13px; border-bottom: 1px solid #cfb784; text-align: left; }
.promotion-tier:last-child { border-bottom: 0; }
.promotion-threshold { margin: 0; color: #a62c36; font-size: 30px; font-weight: 700; line-height: 1.25; white-space: nowrap; }
.promotion-threshold strong { font: inherit; }
.promotion-tier h3 { margin: 7px 0 0; color: #5e4127; font-size: 14px; font-weight: 700; line-height: 1.55; white-space: nowrap; }
.promotion-inline-gifts { padding: 22px 16px 0; }
.promotion-inline-gifts .gift-picker-search { margin-top: 0; }
.promotion-gift-jump { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 44px; margin-top: 16px; padding: 10px 14px; border: 1px solid #a62c36; border-radius: 6px; background: #a62c36; color: #fff; font-size: 14px; font-weight: 600; line-height: 1.5; }
.promotion-gift-jump svg { width: 17px; height: 17px; flex-shrink: 0; }
.promotion-gift-jump:focus-visible { outline: 2px solid #466456; outline-offset: 3px; }
.promotion-gift-products { padding-top: 16px; scroll-margin-top: 16px; }
.promotion-entry-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.promotion-entry-heading h3, .promotion-entry-heading h2 { margin: 0; font-size: 16px; line-height: 1.5; font-weight: 600; }
.promotion-entry-heading p { margin: 5px 0 0; color: #817771; font-size: 13px; }
.promotion-entry-heading > svg { width: 25px; height: 25px; color: #a62c36; flex-shrink: 0; }
.promotion-selected-line { display: flex; gap: 14px; justify-content: space-between; margin: 0; padding: 9px 0; border-bottom: 1px solid #f0ebe7; font-size: 13px; }
.promotion-selected-line span { min-width: 0; overflow-wrap: anywhere; }
.promotion-selected-line strong { white-space: nowrap; font-weight: 600; }
.promotion-selected-note { color: #817771; font-size: 12px; line-height: 1.7; }
.promotion-invalid, .gift-picker-warning { color: #a62c36; font-size: 13px; line-height: 1.7; }
.gift-picker-page { color: #392f2b; }
.gift-picker-page .site-frame, .promotion-inline-page .site-frame { padding-bottom: calc(176px + env(safe-area-inset-bottom)); }
.gift-picker-header { position: sticky; top: 0; z-index: 6; padding: 8px 16px 12px; background: #fff; border-bottom: 1px solid #e9e4df; }
.gift-picker-titlebar { display: grid; grid-template-columns: 38px minmax(0, 1fr) 38px; align-items: center; min-height: 44px; }
.gift-picker-titlebar h1 { margin: 0; text-align: center; font-size: 18px; font-weight: 600; line-height: 1.5; }
.gift-icon-button { display: inline-flex; justify-content: center; align-items: center; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 4px; color: inherit; background: transparent; cursor: pointer; }
.gift-icon-button svg { width: 21px; height: 21px; }
.gift-picker-subtitle { margin: 7px 0 12px; font-size: 12px; color: #78554d; text-align: center; line-height: 1.6; }
.gift-picker-search { display: flex; align-items: center; gap: 9px; height: 40px; padding: 0 12px; background: #f5f5f4; border: 1px solid #e8e5e1; border-radius: 5px; }
.gift-picker-search svg { width: 17px; height: 17px; color: #8b827c; flex-shrink: 0; }
.gift-picker-search input { width: 100%; min-width: 0; height: 100%; padding: 0; border: 0; background: transparent; color: #39312c; font: inherit; font-size: 14px; outline: none; }
.gift-picker-search:focus-within { outline: 2px solid #a62c36; outline-offset: 1px; }
.gift-picker-main { padding: 19px 16px 20px; }
.gift-picker-list-heading { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.gift-picker-list-heading h2 { margin: 0; font-size: 16px; font-weight: 600; }
.gift-picker-list-heading span { color: #8a7f78; font-size: 12px; }
.gift-preview-note { margin: 9px 0 16px; color: #8a7f78; font-size: 11px; line-height: 1.7; }
.gift-picker-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
.gift-card { min-width: 0; padding: 0 0 12px; overflow: hidden; border: 1px solid #e8e3de; border-radius: 6px; background: #fff; }
.gift-card.is-selected { border-color: #b5545c; box-shadow: 0 0 0 1px #b5545c; }
.gift-card-photo { display: grid; place-items: center; width: 100%; aspect-ratio: 1 / 1; padding: 10px; border: 0; border-radius: 0; background: #f8f8f6; cursor: zoom-in; }
.gift-card-photo img { display: block; width: 100%; height: 100%; max-height: 170px; object-fit: contain; }
.gift-card h3 { margin: 12px 10px 0; font-size: 14px; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.gift-card-status { min-height: 18px; margin: 3px 10px 9px; font-size: 11px; color: #a62c36; line-height: 18px; }
.gift-stepper { display: grid; grid-template-columns: 36px minmax(24px, 1fr) 36px; align-items: center; height: 36px; max-width: 132px; margin-inline: auto; padding-inline: 4px; }
.gift-stepper button { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid #dcd6d0; border-radius: 4px; background: #fff; color: #a62c36; cursor: pointer; }
.gift-stepper button:last-child { background: #a62c36; border-color: #a62c36; color: #fff; }
.gift-stepper button:disabled { border-color: #eeeae6; background: #f5f3f1; color: #bbb2ad; cursor: default; }
.gift-stepper svg { width: 17px; height: 17px; }
.gift-stepper output { text-align: center; font-size: 14px; font-variant-numeric: tabular-nums; }
.gift-selection-footer { position: fixed; z-index: 11; bottom: calc(64px + env(safe-area-inset-bottom)); left: 50%; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; width: min(100%, var(--frame-width, 480px)); min-height: 83px; padding: 12px 16px; transform: translateX(-50%); border-top: 1px solid #e6ded7; background: #fff; }
.gift-selection-footer strong { display: block; font-size: 15px; line-height: 1.5; font-weight: 600; }
.gift-selection-footer p { margin: 4px 0 0; font-size: 11px; color: #817771; line-height: 1.6; }
.gift-selection-toggle { display: flex; align-items: center; gap: 8px; width: 100%; min-width: 0; min-height: 48px; padding: 0; border: 0; color: inherit; background: transparent; text-align: left; cursor: pointer; }
.gift-selection-basket { position: relative; display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 42px; color: #a62c36; }
.gift-selection-basket > svg { width: 30px; height: 30px; }
.gift-selection-basket > span { position: absolute; top: -2px; right: -3px; display: grid; place-items: center; min-width: 19px; height: 19px; padding: 0 4px; border: 2px solid #fff; border-radius: 50%; background: #a62c36; color: #fff; font-size: 10px; line-height: 1; font-variant-numeric: tabular-nums; }
.gift-selection-copy { flex: 1; min-width: 0; }
.gift-selection-caption { display: block; margin-top: 3px; color: #817771; font-size: 11px; line-height: 1.5; }
.gift-selection-chevron { flex: 0 0 16px; width: 16px; height: 16px; color: #817771; transition: transform .18s ease; }
.gift-selection-toggle[aria-expanded="true"] .gift-selection-chevron { transform: rotate(180deg); }
.gift-selection-dialog { position: fixed; inset: auto 0 calc(64px + env(safe-area-inset-bottom)); width: min(100%, var(--frame-width, 480px)); max-width: 100%; max-height: min(76vh, 660px); max-height: min(76dvh, 660px); margin: 0 auto; padding: 0; overflow: hidden; border: 0; border-radius: 8px 8px 0 0; background: #fff; color: #392f2b; }
.gift-selection-dialog[open] { display: flex; flex-direction: column; animation: gift-selection-enter .18s ease-out; }
.gift-selection-dialog::backdrop { background: rgba(28, 25, 23, .48); }
.gift-selection-sheet-head { display: flex; flex: 0 0 auto; align-items: center; gap: 10px; padding: 13px 12px 12px 16px; border-bottom: 1px solid #ece7e2; }
.gift-selection-sheet-heading { flex: 1; min-width: 0; }
.gift-selection-sheet-heading h2 { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.5; }
.gift-selection-sheet-heading p { margin: 3px 0 0; color: #817771; font-size: 12px; line-height: 1.5; }
.gift-selection-clear { display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-height: 38px; padding: 4px 6px; border: 0; color: #817771; background: transparent; font-size: 12px; cursor: pointer; }
.gift-selection-clear svg { width: 15px; height: 15px; }
.gift-selection-clear:disabled { color: #bcb5af; cursor: default; }
.gift-selection-sheet-list { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 16px; }
.gift-selected-item { display: grid; grid-template-columns: 68px minmax(0, 1fr); column-gap: 12px; align-items: center; min-height: 104px; padding: 14px 0; border-bottom: 1px solid #f0ebe7; }
.gift-selected-item:last-child { border-bottom: 0; }
.gift-selected-item img { grid-row: span 2; display: block; width: 68px; height: 72px; padding: 3px; object-fit: contain; background: #f8f8f6; border-radius: 4px; }
.gift-selected-item h3 { min-width: 0; margin: 0 0 8px; font-size: 14px; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.gift-selected-item .gift-stepper { grid-column: 2; justify-self: end; width: 132px; max-width: 100%; margin: 0; padding: 0; }
.gift-selection-sheet-empty { display: grid; justify-items: center; gap: 14px; padding: 30px 0; color: #817771; font-size: 14px; }
.gift-selection-sheet-empty p { margin: 0; }
.gift-selection-continue { min-height: 40px; padding: 8px 18px; border: 1px solid #d7cbc1; border-radius: 5px; color: #78554d; background: #fff; font-size: 14px; cursor: pointer; }
.gift-selection-dialog .gift-selection-footer { position: static; flex: 0 0 auto; width: 100%; transform: none; }
.gift-selection-dialog .gift-picker-warning { margin: 0; padding: 8px 16px; }
.gift-selection-dialog button:focus-visible { outline: 2px solid #466456; outline-offset: -2px; }
@keyframes gift-selection-enter { from { opacity: .6; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .gift-selection-dialog[open] { animation: none; } .gift-selection-chevron { transition: none; } }
.gift-confirm { min-width: 104px; min-height: 44px; padding: 10px 13px; border: 1px solid #a62c36; border-radius: 5px; background: #a62c36; color: #fff; font-size: 14px; font-weight: 600; cursor: pointer; }
.gift-confirm:disabled { border-color: #d9d2ce; background: #d9d2ce; color: #fff; cursor: default; }
.gift-picker-empty { padding: 32px 0; color: #8a7f78; text-align: center; font-size: 14px; }
.gift-picker-page [hidden], .promotion-page [hidden] { display: none !important; }
.gift-image-dialog { width: min(90%, 420px); max-height: 85vh; padding: 44px 18px 16px; border: 0; border-radius: 8px; color: #392f2b; background: #fff; }
.gift-image-dialog::backdrop { background: rgba(26, 24, 22, .7); }
.gift-image-dialog img { display: block; width: 100%; height: 55vh; object-fit: contain; cursor: zoom-out; }
.gift-image-dialog p { margin: 14px 0 0; text-align: center; font-size: 14px; }
.gift-image-close { position: absolute; right: 6px; top: 4px; }
.gift-toast { position: fixed; z-index: 30; left: 50%; bottom: 172px; transform: translateX(-50%); width: max-content; max-width: calc(100% - 32px); padding: 10px 14px; border-radius: 5px; color: #fff; background: #39312c; font-size: 13px; }
.gift-picker-page button:focus-visible, .gift-picker-page a:focus-visible, .promotion-inline-page button:focus-visible { outline: 2px solid #466456; outline-offset: 3px; }
@media (max-width: 350px) {
  .gift-picker-main, .gift-picker-header, .promotion-inline-gifts { padding-inline: 12px; }
  .gift-picker-grid { gap: 14px 10px; }
  .gift-selection-footer { padding-inline: 12px; gap: 7px; }
  .gift-selection-footer strong { font-size: 14px; }
  .gift-confirm { min-width: 98px; padding-inline: 10px; }
  .gift-card-photo { padding: 8px; }
}
