.theme-scenery {
  display: contents;
}
.theme-scenery > img {
  position: absolute;
  pointer-events: none;
  max-width: none;
}
.theme-wall {
  left: 0;
  top: 0;
  --xhs-width:73.2%;
  width: 73.2%;
  --xhs-height:21.6%;
  height: 21.6%;
  z-index: 1;
}
.theme-floor {
  left: 0;
  top: 21.4%;
  --xhs-width:100%;
  width: 100%;
  --xhs-height:78.6%;
  height: 78.6%;
  z-index: 2;
  clip-path: polygon(25% 0, 72% 0, 100% 6%, 100% 100%, 0 100%, 0 10%);
}
.theme-trim,
.theme-fixtures,
.theme-corners,
.theme-kitchen,
.theme-exterior {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  --xhs-width:100%;
  width: 100%;
  --xhs-height:100%;
  height: 100%;
}
.theme-trim {
  z-index: 12;
}
.theme-fixtures {
  z-index: 13;
  clip-path: polygon(30% 0, 100% 0, 100% 31%, 30% 31%);
}
.theme-corners {
  z-index: 1600;
  clip-path: inset(76% 0 0 0);
}
.theme-kitchen {
  z-index: 5;
  clip-path: polygon(0 0, 31% 0, 31% 32%, 0 32%);
}
.theme-exterior {
  z-index: 3;
  clip-path: polygon(73% 0, 100% 0, 100% 26.5%, 73% 20.5%);
}
.theme-prop,
.theme-sprite {
  position: absolute;
  display: block;
  pointer-events: none;
}
.theme-prop {
  filter: drop-shadow(0 3px 2px #644d4938);
}
.theme-sprite {
  overflow: hidden;
}
.theme-sprite > img {
  position: absolute;
  max-width: none;
  pointer-events: none;
}
.theme-table-front {
  clip-path: polygon(0 0, 100% 0, 100% 42%, 0 42%);
}
#upgradeModal {
  display: flex;
  flex-direction: column;
  --xhs-height:calc(100% - 30px);
  height: calc(100% - 30px);
  overflow: hidden;
}
#upgradeModal,
.decor-dialog-card,
.decor-preview-card {
  text-align: center;
}
#upgradeModal > .modal-head {
  flex-shrink: 0;
}
.decor-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  --xhs-row-gap:8px;
  --xhs-column-gap:8px;
  grid-gap: 8px;
  gap: 8px;
  flex-shrink: 0;
}
.decor-tabs > button,
.decor-categories > button {
  min-height: 44px;
  border: 1px solid #bca1b7;
  border-radius: 12px;
  background: #fffaf3;
  color: var(--ink);
}
.decor-tabs > button[aria-pressed=true],
.decor-categories > button[aria-pressed=true] {
  background: #f6dfae;
  border-color: #ad8457;
  box-shadow: inset 0 2px 0 #fff3da;
}
.decor-wallet {
  margin: 8px 0;
  font-size: 12px;
  text-align: center;
  color: var(--muted);
  flex-shrink: 0;
}
.decor-panel {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
.decor-scroll {
  overflow-y: auto;
  overscroll-behavior: contain;
  min-height: 0;
  flex: 1;
  padding: 2px 2px 12px;
  scrollbar-width: thin;
}
.decor-categories {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  --xhs-row-gap:5px;
  --xhs-column-gap:5px;
  grid-gap: 5px;
  gap: 5px;
  flex-shrink: 0;
  padding-bottom: 8px;
}
.decor-categories > button {
  font-size: 11px;
  padding: 3px;
}
.decor-store-hint {
  font-size: 11px;
  line-height: 1.6;
  color: var(--muted);
  margin: 3px 0 10px;
}
.decor-section-title {
  font-size: 14px;
  margin: 9px 2px;
}
.decor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  --xhs-row-gap:10px;
  --xhs-column-gap:10px;
  grid-gap: 10px;
  gap: 10px;
}
.decor-item {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-width: 0;
  padding: 9px;
  border: 1px solid #d4bbc5;
  border-radius: 15px;
  background: #fffaf3;
  box-shadow: 0 3px 0 #dac8cc;
}
.decor-item[data-part=bundle] {
  background: #fff4d9;
  border-color: #c5a169;
}
.decor-thumb {
  position: relative;
  display: block;
  --xhs-width:100%;
  width: 100%;
  --xhs-height:92px;
  height: 92px;
  overflow: hidden;
  pointer-events: none;
  margin: 0 auto 5px;
}
.decor-thumb > img {
  display: block;
  --xhs-width:100%;
  width: 100%;
  --xhs-height:100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}
.original-wall > img {
  --xhs-height:430%;
  height: 430%;
  object-fit: fill;
  object-position: top;
  position: absolute;
  top: 0;
}
.original-floor > img {
  --xhs-height:180%;
  height: 180%;
  object-fit: cover;
  position: absolute;
  bottom: 0;
}
.decor-item > b {
  font-size: 12px;
  line-height: 1.5;
  min-height: 36px;
}
.decor-prices {
  display: flex;
  flex-wrap: wrap;
  --xhs-row-gap:3px;
  --xhs-column-gap:7px;
  grid-gap: 3px 7px;
  gap: 3px 7px;
  font-size: 11px;
  line-height: 1.7;
}
.decor-prices > span {
  display: flex;
  align-items: center;
  --xhs-row-gap:3px;
  --xhs-column-gap:3px;
  grid-gap: 3px;
  gap: 3px;
  white-space: nowrap;
}
.decor-prices img {
  --xhs-width:15px;
  width: 15px;
  --xhs-height:15px;
  height: 15px;
  object-fit: contain;
}
.decor-stock {
  font-size: 10px;
  line-height: 1.5;
  color: var(--muted);
  margin: 4px 0 7px;
  min-height: 30px;
}
.decor-item-actions {
  display: flex;
  --xhs-row-gap:5px;
  --xhs-column-gap:5px;
  grid-gap: 5px;
  gap: 5px;
  margin-top: auto;
}
.decor-item-actions > button {
  flex: 1;
  min-height: 44px;
  min-width: 0;
  padding: 3px;
  border: 1px solid #ba9caa;
  border-radius: 9px;
  background: #f7e9e2;
  font-size: 12px;
}
.decor-item button:disabled,
.decor-overlay button:disabled {
  opacity: .45;
  cursor: default;
}
.decor-overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  background: rgba(76, 60, 91, .44);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}
.decor-dialog-card,
.decor-preview-card {
  --xhs-width:100%;
  width: 100%;
  max-width: 350px;
  max-height: 100%;
  overflow-y: auto;
  padding: 20px 16px;
  box-shadow: 0 8px 28px rgba(70, 54, 81, .333);
}
.decor-dialog-card h3,
.decor-preview-card h3 {
  margin: 0 0 9px;
  font-size: 18px;
  line-height: 1.5;
}
.decor-dialog-card p,
.decor-preview-card p {
  font-size: 12px;
  line-height: 1.6;
  color: var(--muted);
  margin: 8px 0;
}
#decorPurchaseArt .decor-thumb {
  --xhs-width:135px;
  width: 135px;
  --xhs-height:65px;
  height: 65px;
}
.decor-quantity {
  display: flex;
  align-items: center;
  justify-content: space-between;
  --xhs-row-gap:10px;
  --xhs-column-gap:10px;
  grid-gap: 10px;
  gap: 10px;
  margin: 12px 0;
  font-size: 14px;
}
.decor-quantity > select {
  min-width: 100px;
  min-height: 44px;
  padding: 6px;
  border: 1px solid #b79cae;
  border-radius: 9px;
  background: #fffaf3;
  font: inherit;
  color: inherit;
}
.decor-purchase-prices {
  padding: 9px;
  margin: 10px 0;
  border-radius: 12px;
  background: #fff2d7;
}
.decor-purchase-prices .decor-prices {
  justify-content: center;
  --xhs-row-gap:8px;
  --xhs-column-gap:18px;
  grid-gap: 8px 18px;
  gap: 8px 18px;
  font-size: 15px;
}
.decor-purchase-prices img {
  --xhs-width:21px;
  width: 21px;
  --xhs-height:21px;
  height: 21px;
}
.decor-payment,
.decor-dialog-actions {
  display: flex;
  --xhs-row-gap:8px;
  --xhs-column-gap:8px;
  grid-gap: 8px;
  gap: 8px;
  margin-top: 9px;
}
.decor-overlay button {
  min-height: 44px;
  flex: 1;
  border: 1px solid #b599a9;
  border-radius: 11px;
  padding: 7px;
  background: #fffaf3;
  color: var(--ink);
  font: inherit;
  font-size: 13px;
}
.decor-payment > button {
  background: #f3daae;
  border-color: #bc965d;
}
.decor-preview {
  z-index: 90;
}
.decor-preview-card {
  text-align: center;
}
.decor-preview-scene {
  position: relative;
  --xhs-aspect-ratio:941/1672;
  aspect-ratio: 941/1672;
  --xhs-width:var(--xhs-local-28);
  width: var(--xhs-local-28);
  width: min(100%, calc((100dvh - 280px)*.563));
  max-width: 300px;
  margin: 12px auto;
  overflow: hidden;
  border-radius: 13px;
  background: #e8e1ed;
}
.decor-preview-scene button {
  pointer-events: none;
}
.decor-preview-card > button {
  --xhs-width:100%;
  width: 100%;
}
@media (max-width: 360px) {
  .decor-categories > button {
    font-size: 10px;
    padding: 3px 2px;
  }
  .decor-dialog-card {
    padding: 16px 12px;
  }
  .decor-dialog-card h3 {
    font-size: 16px;
  }
  .decor-dialog-card p {
    font-size: 11px;
    line-height: 1.5;
  }
  .decor-quantity {
    margin: 8px 0;
  }
  .decor-preview-card {
    padding: 16px 12px;
  }
  .decor-preview-card h3 {
    font-size: 16px;
  }
}
.decor-wallet .decor-prices,
.decor-item .decor-prices {
  justify-content: center;
}
.decor-wallet .decor-prices {
  font-size: 13px;
  --xhs-row-gap:8px;
  --xhs-column-gap:18px;
  grid-gap: 8px 18px;
  gap: 8px 18px;
  color: #654966;
}
.decor-wallet img {
  --xhs-width:20px;
  width: 20px;
  --xhs-height:20px;
  height: 20px;
}
.decor-tabs > button,
.decor-categories > button,
.decor-item-actions > button,
.decor-overlay button {
  --button-light:#fff9ed;
  --button-base:#efc9d7;
  --button-edge:#ae788e;
  --button-depth:#94677f;
  position: relative;
  border: 2px solid var(--button-edge);
  border-radius: 22px;
  background:
    linear-gradient(
      165deg,
      var(--button-light),
      var(--button-base));
  color: #60405d;
  font-weight: 900;
  text-shadow: 0 1px #fff;
  box-shadow:
    inset 0 2px 2px #fff,
    inset 0 -2px 1px rgba(176, 120, 157, .25),
    0 4px 0 var(--button-depth),
    0 6px 7px rgba(118, 83, 117, .19);
  transition: transform .1s, box-shadow .1s;
  touch-action: manipulation;
}
.decor-tabs > button:before,
.decor-item-actions > button:before,
.decor-overlay button:before {
  content: "";
  position: absolute;
  left: 17%;
  right: 35%;
  top: 3px;
  --xhs-height:4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .66);
  pointer-events: none;
}
.decor-tabs > button:active,
.decor-categories > button:active,
.decor-item-actions > button:active,
.decor-overlay button:active {
  --xhs-transform:translateY(4px) scale(.97);
  transform: translateY(4px) scale(.97);
  box-shadow: inset 0 2px 3px rgba(124, 86, 125, .208), 0 1px 0 var(--button-depth);
}
.decor-tabs > button[aria-pressed=true],
.decor-categories > button[aria-pressed=true] {
  background: linear-gradient(#fff9df, #f5d28e);
  border-color: #af864e;
  box-shadow:
    inset 0 2px #fff,
    0 4px 0 #a78055,
    0 0 0 2px #ffedd0;
}
.decor-categories {
  --xhs-row-gap:6px;
  --xhs-column-gap:6px;
  grid-gap: 6px;
  gap: 6px;
  padding-bottom: 12px;
}
.decor-categories > button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  --xhs-row-gap:1px;
  --xhs-column-gap:1px;
  grid-gap: 1px;
  gap: 1px;
  min-height: 65px;
  padding: 4px 2px;
  font-size: 10px;
  line-height: 1.3;
}
.decor-categories > button > img {
  --xhs-width:27px;
  width: 27px;
  --xhs-height:26px;
  height: 26px;
  object-fit: contain;
  pointer-events: none;
}
.decor-categories > button:before {
  content: "";
  position: absolute;
  top: -2px;
  right: -2px;
  bottom: -2px;
  left: -2px;
  top: -2px;
  right: -2px;
  bottom: -2px;
  left: -2px;
  border: 2px solid transparent;
  border-image: var(--card-tile-art) 28% / 15px / 0 stretch;
  pointer-events: none;
}
.decor-categories > [data-category=sakura-pink] {
  --button-base:#f8c5d5;
  --button-edge:#b87394;
  --button-depth:#9e668a;
}
.decor-categories > [data-category=marshmallow-yellow] {
  --button-base:#ffe099;
  --button-edge:#bb9153;
  --button-depth:#a77c47;
}
.decor-categories > [data-category=candy-green] {
  --button-base:#d3eab0;
  --button-edge:#78a278;
  --button-depth:#618666;
}
.decor-categories > button[aria-pressed=true] {
  background: linear-gradient(var(--button-light), var(--button-base));
  border-color: var(--button-edge);
  box-shadow:
    inset 0 2px #fff,
    0 4px 0 var(--button-depth),
    0 0 0 2px var(--button-base);
}
.decor-tabs > button[aria-pressed=true]:active,
.decor-categories > button[aria-pressed=true]:active {
  box-shadow: inset 0 2px 4px rgba(133, 111, 134, .25), 0 1px 0 var(--button-depth);
}
.decor-item {
  border: 4px solid transparent;
  border-image: var(--card-tile-art) 28% fill / 26px / 0 stretch;
  background: none;
  border-radius: 22px;
  padding: 12px 9px 15px;
}
.decor-item[data-part=bundle] {
  background: none;
}
.decor-item-actions {
  padding-top: 3px;
  --xhs-row-gap:6px;
  --xhs-column-gap:6px;
  grid-gap: 6px;
  gap: 6px;
}
.decor-item-actions > button {
  font-size: 12px;
  padding: 3px 1px;
  min-height: 44px;
}
.decor-overlay .decor-payment > button {
  --button-base:#f7d69c;
  --button-edge:#b38a54;
  --button-depth:#987448;
}
.decor-overlay #decorPurchaseCancel {
  --button-base:#edb6c2;
}
.decor-quantity {
  justify-content: center;
  flex-wrap: wrap;
}
.is-machine-preview {
  --xhs-aspect-ratio:1;
  aspect-ratio: 1;
  --xhs-width:var(--xhs-math-12);
  width: var(--xhs-math-12);
  width: min(180px, 45dvh);
  background: transparent;
}
.is-machine-preview > img {
  display: block;
  --xhs-width:100%;
  width: 100%;
  --xhs-height:100%;
  height: 100%;
  object-fit: contain;
}
#decorCategories {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.decor-mine-categories {
  grid-template-columns: 1fr 1fr;
}
.decor-mine-categories > button {
  min-height: 44px;
  font-size: 12px;
}
.outfit-item .decor-thumb {
  --xhs-height:125px;
  height: 125px;
}
.outfit-item .decor-stock {
  min-height: 16px;
}
.outfit-actions {
  flex-direction: column;
  --xhs-row-gap:8px;
  --xhs-column-gap:8px;
  grid-gap: 8px;
  gap: 8px;
}
.is-outfit-preview {
  display: grid;
  grid-template-columns: 1fr 1fr;
  --xhs-row-gap:12px;
  --xhs-column-gap:0;
  grid-gap: 12px 0;
  gap: 12px 0;
  --xhs-aspect-ratio:auto;
  aspect-ratio: auto;
  --xhs-width:100%;
  width: 100%;
  max-width: 300px;
  padding: 14px 8px;
  background: #f8eedc;
  overflow: visible;
}
.outfit-view {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
}
.outfit-view > .character-sprite {
  position: relative;
  display: block;
  --xhs-width:82px;
  width: 82px;
  --xhs-height:82px;
  height: 82px;
  margin-top: 54px;
  overflow: visible;
}
.outfit-view > small {
  font-size: 11px;
  color: var(--muted);
  margin-top: 8px;
}
.shop-customer .customer-order {
  position: absolute;
  left: 50%;
  bottom: calc(var(--order-head-height) + 6px);
  --xhs-transform:translateX(-50%);
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  --xhs-row-gap:2px;
  --xhs-column-gap:2px;
  grid-gap: 2px;
  gap: 2px;
  --xhs-width:max-content;
  width: max-content;
  padding: 2px 3px;
  border: 2px solid #ab8b9f;
  border-radius: 17px;
  background: #fffaf2;
  box-shadow: 0 3px 0 #cbb9ca;
  pointer-events: none;
}
.shop-customer .customer-order:before {
  display: none;
}
.table-slot:nth-child(n) .served-dish.dish-side-left {
  left: 37%;
}
.table-slot:nth-child(n) .served-dish.dish-side-right {
  left: 67%;
}
@media (max-width: 360px) {
  .decor-item {
    padding: 11px 8px 14px;
  }
  .decor-item-actions > button {
    font-size: 11px;
  }
}
.decor-item[data-facility^=machine]:not([data-facility=machineAdd]) .decor-stock {
  white-space: pre-line;
}
.is-machine-upgrade #decorPurchaseNote {
  white-space: pre-line;
  text-align: left;
  line-height: 1.85;
  font-size: 14px;
  margin: 12px 4px;
  color: #634b63;
}
.is-machine-upgrade #decorPurchasePrices:empty {
  display: none;
}
.is-machine-upgrade #decorPurchasePrices:not(:empty):before {
  content: "升级费用";
  font-size: 13px;
  margin-right: 8px;
}
.is-machine-upgrade .decor-dialog-card {
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
}
.is-upgrade-success .decor-payment {
  display: none;
}
.is-upgrade-success #decorPurchaseCancel {
  --button-base:#d3e6ba;
  --button-edge:#7f9b71;
  --button-depth:#65845a;
  min-width: 120px;
}
.is-upgrade-success #decorPurchaseArt .decor-thumb {
  animation: machine-upgrade-pop .48s ease-out both;
  transform-origin: 50% 85%;
}
@keyframes machine-upgrade-pop {
  0% {
    --xhs-transform:scale(.9);
    transform: scale(.9);
  }
  45% {
    --xhs-transform:translateY(-7px) scale(1.08);
    transform: translateY(-7px) scale(1.08);
  }
  75% {
    --xhs-transform:scale(.98);
    transform: scale(.98);
  }
  100% {
    --xhs-transform:scale(1);
    transform: scale(1);
  }
}
@media (prefers-reduced-motion: reduce) {
  .is-upgrade-success #decorPurchaseArt .decor-thumb {
    animation: none;
  }
}
#upgradeModal .decor-item[data-prop] > b {
  min-height: 22px;
}
#upgradeModal .decor-item[data-prop] .decor-stock {
  min-height: 0;
  font-size: 11px;
  line-height: 1.4;
  margin: 5px 0;
}
@media (max-height: 650px) {
  #upgradeModal .decor-item[data-prop] .decor-thumb {
    --xhs-height:48px;
    height: 48px;
  }
  #upgradeModal .decor-item[data-prop] {
    padding: 8px 8px 12px;
  }
  #upgradeModal .decor-item[data-prop] .decor-prices {
    margin: 3px 0;
  }
}