/* Patch 02 — moiomi Art discovery and artwork configurator */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.art-discovery {
  min-height: 70vh;
  padding: clamp(28px, 3.8vw, 58px) 0 clamp(84px, 9vw, 140px);
  background: rgba(255, 255, 255, .74);
}

.art-filter {
  padding: clamp(24px, 3vw, 44px);
  border: 1px solid rgba(52, 62, 56, .12);
  border-radius: 26px;
  background: rgba(255, 255, 255, .76);
  box-shadow: 0 18px 60px rgba(39, 49, 43, .055);
}

.art-filter__title {
  margin: 0 0 20px;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 760;
  letter-spacing: .18em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
}

.art-filter__chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

.art-style-chip {
  min-height: 54px;
  padding: 0 24px;
  border: 1px solid rgba(35, 43, 38, .14);
  border-radius: 999px;
  background: rgba(255, 255, 255, .64);
  color: #232824;
  font-size: 15px;
  font-weight: 650;
  cursor: pointer;
  transition: color var(--transition), background var(--transition), border-color var(--transition), transform var(--transition), box-shadow var(--transition);
}

.art-style-chip:hover,
.art-style-chip:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(35, 43, 38, .28);
  background: #fff;
  box-shadow: 0 10px 26px rgba(40, 49, 44, .08);
}

.art-style-chip.is-selected {
  border-color: #171a18;
  background: #171a18;
  color: #fff;
  box-shadow: 0 12px 26px rgba(23, 26, 24, .16);
}

.art-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 30px 0 24px;
}

.art-toolbar > strong {
  font-size: 16px;
  font-weight: 700;
}

.art-toolbar__controls,
.art-orientation-filter {
  display: flex;
  align-items: center;
  gap: 8px;
}

.art-orientation-button {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid rgba(35, 43, 38, .13);
  border-radius: 14px;
  background: rgba(255, 255, 255, .78);
  color: #282e29;
  cursor: pointer;
  transition: background var(--transition), border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

.art-orientation-button svg { width: 25px; height: 25px; }
.art-orientation-button:hover,
.art-orientation-button:focus-visible { transform: translateY(-1px); border-color: rgba(35,43,38,.28); box-shadow: 0 8px 22px rgba(35,43,38,.08); }
.art-orientation-button.is-selected { border-color: var(--color-accent); background: rgba(17, 17, 17, .06); box-shadow: inset 0 0 0 1px rgba(17,17,17,.15); }

.art-sort {
  position: relative;
  display: flex;
  align-items: center;
  min-width: 190px;
}

.art-sort select {
  width: 100%;
  min-height: 48px;
  padding: 0 46px 0 18px;
  border: 1px solid rgba(35, 43, 38, .13);
  border-radius: 14px;
  appearance: none;
  background: rgba(255,255,255,.82);
  color: var(--color-text);
  cursor: pointer;
}

.art-sort svg {
  position: absolute;
  right: 17px;
  width: 16px;
  height: 16px;
  pointer-events: none;
}

.art-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(18px, 2vw, 30px);
}

.art-card {
  position: relative;
  min-width: 0;
}

.art-card__link { display: block; }
.art-card__visual {
  display: grid;
  min-height: 0;
  place-items: center;
  overflow: hidden;
  border-radius: 3px;
  background: #efede8;
  box-shadow: inset 0 0 0 1px rgba(38,45,40,.045);
}
.art-card__visual--landscape { aspect-ratio: 1.22 / 1; }
.art-card__visual--portrait { aspect-ratio: .78 / 1; }
.art-card__visual--square { aspect-ratio: 1 / 1; }
.art-card__visual--collection { aspect-ratio: 1.28 / 1; }
.art-card__visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 440ms cubic-bezier(.2,.8,.2,1), filter 440ms ease;
}
.art-card:hover .art-card__visual img { transform: scale(1.018); filter: saturate(1.03); }

.art-card__body {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 2px 4px;
}
.art-card__body h2 { font-size: 17px; font-weight: 640; letter-spacing: -.018em; }
.art-card__body p { flex: 0 0 auto; font-size: 13px; }

.art-card__wishlist,
.art-pdp-wishlist {
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 50%;
  background: rgba(255,255,255,.72);
  color: var(--color-text);
  box-shadow: 0 8px 24px rgba(36,44,39,.10), inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter: blur(14px);
  cursor: pointer;
  transition: transform var(--transition), background var(--transition), color var(--transition);
}
.art-card__wishlist {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 42px;
  height: 42px;
}
.art-card__wishlist svg,
.art-pdp-wishlist svg { width: 20px; height: 20px; }
.art-card__wishlist:hover,
.art-pdp-wishlist:hover { transform: scale(1.04); background: #fff; }
.art-card__wishlist.is-active,
.art-pdp-wishlist.is-active { color: #526557; }

.art-empty {
  display: grid;
  min-height: 360px;
  place-items: center;
  gap: 18px;
  text-align: center;
}
.art-empty h2 { font-size: 28px; }

/* Patch 03 — template-led artwork PDP */
.art-product-page {
  min-height: calc(100vh - var(--header-height));
  padding: 14px 0 36px;
  background: rgba(255,255,255,.82);
}

.art-product-shell { max-width: 1480px; }
.art-product-shell > .breadcrumb { margin-bottom: 12px; }

.art-product-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(390px, 430px);
  gap: 18px;
  align-items: start;
  min-width: 0;
}

.artwork-gallery {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 14px;
  min-width: 0;
  height: min(742px, calc(100vh - var(--header-height) - 76px));
  min-height: 620px;
}

.artwork-gallery__thumbnails {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
  overflow-y: auto;
  padding: 1px;
  scrollbar-width: none;
}
.artwork-gallery__thumbnails::-webkit-scrollbar { display: none; }

.art-gallery-thumb {
  position: relative;
  display: grid;
  flex: 0 0 86px;
  width: 86px;
  height: 86px;
  place-items: center;
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(46,55,50,.12);
  border-radius: 13px;
  background: #f5f3ee;
  color: var(--color-text);
  cursor: pointer;
  transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}
.art-gallery-thumb:hover,
.art-gallery-thumb:focus-visible { transform: translateY(-1px); border-color: rgba(46,55,50,.30); }
.art-gallery-thumb.is-selected { border-color: var(--color-accent); box-shadow: inset 0 0 0 1px var(--color-accent); }
.art-gallery-thumb > img,
.art-gallery-thumb .art-thumb-texture img { width: 100%; height: 100%; object-fit: cover; }
.art-thumb-frame { width: 58px; height: 58px; border: 13px solid var(--frame-color); background: #f7f2e8; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.art-thumb-texture { display: block; width: 100%; height: 100%; overflow: hidden; }
.art-thumb-texture img { transform: scale(2.5) translate(-14%, 7%); }
.art-thumb-dimensions { display: grid; width: 62px; height: 62px; place-items: center; border: 1px solid rgba(45,55,49,.18); font-size: 9px; font-weight: 700; line-height: 1.2; text-align: center; }
.art-thumb-collection { display: grid; width: 66px; grid-template-columns: repeat(4, 1fr); gap: 3px; }
.art-thumb-collection i { aspect-ratio: .72 / 1; border: 2px solid #b98a55; background: #f5eee2; }

.artwork-gallery__main {
  position: relative;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(48,58,52,.09);
  border-radius: 18px;
  background: #f4f3ef;
}

.art-gallery-stage {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
}
.art-gallery-stage--artwork { padding: clamp(34px, 4vw, 66px); background: radial-gradient(circle at 50% 22%,#fff 0,#f8f7f3 48%,#ecece7 100%); }
.art-gallery-stage--room { background: #e9e5dc; }
.art-gallery-room { width: 100%; height: 100%; object-fit: cover; transition: transform 360ms ease; }
.art-gallery-room__placement { position: absolute; top: 14%; left: 50%; width: min(30vw, 390px); transform: translateX(-50%); transition: transform 360ms ease; }
.art-gallery-room__placement--portrait { width: min(19vw, 250px); top: 11%; }
.art-gallery-room__placement--square { width: min(23vw, 300px); top: 12%; }
.art-gallery-room__placement--collection { width: min(48vw, 610px); top: 17%; }
.art-gallery-stage--frame { background: linear-gradient(145deg,#eeeae2,#faf9f6); }
.art-frame-detail { position: relative; width: min(72%, 620px); aspect-ratio: 1.2 / 1; overflow: hidden; border: clamp(28px, 5vw, 62px) solid var(--frame-color); box-shadow: 0 26px 70px rgba(31,37,33,.18), inset 0 0 0 2px rgba(255,255,255,.38); }
.art-frame-detail img { width: 160%; height: 160%; object-fit: cover; transform: translate(-18%,-14%); }
.art-gallery-stage--texture { background: #eeeae2; }
.art-gallery-stage--texture > img { width: 145%; height: 145%; object-fit: cover; transition: transform 360ms ease; }
.art-gallery-stage--dimensions { background: #fafaf8; }
.art-dimension-diagram { position: relative; width: min(68%, 650px); }
.art-dimension-diagram__width { position: absolute; right: 0; bottom: -36px; left: 0; color: var(--color-muted); font-size: 12px; font-weight: 650; text-align: center; }
.art-dimension-diagram__width::before,
.art-dimension-diagram__width::after { content:""; position:absolute; top:-12px; width:calc(50% - 70px); height:1px; background:rgba(55,65,58,.28); }
.art-dimension-diagram__width::before { left:0; }
.art-dimension-diagram__width::after { right:0; }
.art-gallery-stage--contents { padding: 30px; background: #f7f5f0; }

.art-magnifier {
  position: absolute;
  z-index: 4;
  top: 18px;
  left: 18px;
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border: 1px solid rgba(255,255,255,.92);
  border-radius: 50%;
  background: rgba(255,255,255,.82);
  box-shadow: 0 10px 28px rgba(44,54,48,.11);
  backdrop-filter: blur(14px);
  cursor: pointer;
}
.art-magnifier svg { width: 22px; height: 22px; }
.art-gallery-stage.is-zoom-1 .art-gallery-room { transform: scale(1.18); }
.art-gallery-stage.is-zoom-2 .art-gallery-room { transform: scale(1.42); }
.art-gallery-stage.is-zoom-1 .art-gallery-room__placement { transform: translateX(-50%) scale(1.18); }
.art-gallery-stage.is-zoom-2 .art-gallery-room__placement { transform: translateX(-50%) scale(1.42); }
.art-gallery-stage--artwork.is-zoom-1 .art-composition { transform: scale(1.28); }
.art-gallery-stage--artwork.is-zoom-2 .art-composition { transform: scale(1.62); }
.art-gallery-stage--texture.is-zoom-1 > img { transform: scale(1.22); }
.art-gallery-stage--texture.is-zoom-2 > img { transform: scale(1.55); }

.art-composition {
  display: grid;
  width: min(72%, 700px);
  filter: drop-shadow(0 22px 30px rgba(33,39,35,.17));
  transition: transform 350ms ease;
}
.art-composition--landscape.art-composition--single { aspect-ratio: 11 / 7.6; }
.art-composition--portrait { width: min(45%, 390px); aspect-ratio: 7.2 / 9.4; }
.art-composition--square.art-composition--single { width: min(58%, 520px); aspect-ratio: 1 / 1; }
.art-composition--two-squares { width: min(65%, 600px); grid-template-columns: repeat(2, 1fr); gap: 12px; aspect-ratio: 2.08 / 1; }
.art-composition--three-portraits { width: min(70%, 680px); grid-template-columns: repeat(3, 1fr); gap: 12px; aspect-ratio: 2.34 / 1; }
.art-composition--grid-four { width: min(58%, 540px); grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); gap: 11px; aspect-ratio: 1 / 1; }
.art-composition--collection { width: min(82%, 760px); grid-template-columns: repeat(4, 1fr); gap: 12px; aspect-ratio: 2.8 / 1; }
.art-composition--room { width: 100%; filter: drop-shadow(0 13px 20px rgba(33,39,35,.28)); }

.art-piece { position: relative; display:block; min-width:0; min-height:0; overflow:hidden; border:9px solid var(--frame-color); background:#fff; box-shadow:inset 0 0 0 1px rgba(255,255,255,.45); }
.art-composition--panel .art-piece { border-width:4px; border-color:#d8d8d3; }
.art-composition--matted-frame .art-piece { border-width:23px; box-shadow:inset 0 0 0 9px #f5f1e9,inset 0 0 0 10px rgba(0,0,0,.07); }
.art-composition--framed-canvas .art-piece { border-width:11px; }
.art-composition--floating-frame .art-piece { border-width:14px; box-shadow:inset 0 0 0 5px #f5f3ee; }
.art-piece img { width:100%; height:100%; object-fit:cover; }
.art-composition--two-squares .art-piece { aspect-ratio:1 / 1; }
.art-composition--two-squares .art-piece img { width:200%; max-width:none; }
.art-composition--two-squares .art-piece:nth-child(2) img { transform:translateX(-50%); }
.art-composition--three-portraits .art-piece { aspect-ratio:.7 / 1; }
.art-composition--three-portraits .art-piece img { width:300%; max-width:none; }
.art-composition--three-portraits .art-piece:nth-child(2) img { transform:translateX(-33.333%); }
.art-composition--three-portraits .art-piece:nth-child(3) img { transform:translateX(-66.666%); }
.art-composition--grid-four .art-piece img { width:200%; height:200%; max-width:none; }
.art-composition--grid-four .art-piece:nth-child(2) img { transform:translateX(-50%); }
.art-composition--grid-four .art-piece:nth-child(3) img { transform:translateY(-50%); }
.art-composition--grid-four .art-piece:nth-child(4) img { transform:translate(-50%,-50%); }
.art-composition--collection .art-piece { aspect-ratio:.72 / 1; }

.art-configurator {
  position: sticky;
  top: calc(var(--header-height) + 10px);
  display: grid;
  grid-template-rows: minmax(0,1fr) auto;
  height: min(742px, calc(100vh - var(--header-height) - 76px));
  min-height: 620px;
  overflow: hidden;
  border: 1px solid rgba(49,59,53,.11);
  border-radius: 18px;
  background: rgba(255,255,255,.97);
  box-shadow: 0 18px 44px rgba(38,47,42,.055);
}
.art-configurator__scroll { overflow-y:auto; overscroll-behavior:contain; padding:22px 24px 28px; }
.art-configurator__scroll::-webkit-scrollbar { width:6px; }
.art-configurator__scroll::-webkit-scrollbar-thumb { border-radius:999px; background:rgba(55,65,58,.18); }

.art-product-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding-bottom:18px; }
.art-product-heading > div { min-width:0; }
.art-product-heading__badge { display:inline-flex; min-height:24px; align-items:center; padding:0 10px; border:1px solid rgba(95,81,58,.14); border-radius:999px; background:#f8f5ee; color:#74634b; font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.art-product-heading h1 { margin-top:6px; font-size:29px; font-weight:650; letter-spacing:-.035em; line-height:1.05; }
.art-product-heading__type { margin-top:4px; color:var(--color-muted); font-size:12px; }
.art-product-heading__price { display:block; margin-top:12px; font-size:24px; font-weight:650; letter-spacing:-.025em; }
.art-product-heading__description { max-width:360px; margin-top:8px; color:var(--color-muted); font-size:12px; line-height:1.48; }
.art-pdp-wishlist { flex:0 0 auto; display:grid; width:40px; height:40px; place-items:center; border:1px solid rgba(45,55,49,.12); border-radius:50%; background:#fff; cursor:pointer; }
.art-pdp-wishlist svg { width:19px; height:19px; }

.art-config-section { padding:17px 0; border-top:1px solid rgba(49,59,53,.09); }
.art-config-section__head { display:flex; align-items:baseline; justify-content:space-between; gap:14px; margin-bottom:11px; }
.art-config-section__head h2 { font-size:14px; font-weight:700; letter-spacing:-.012em; }
.art-config-section__head > strong { overflow:hidden; color:var(--color-muted); font-size:11px; font-weight:550; text-overflow:ellipsis; white-space:nowrap; }

.art-option-grid { display:grid; gap:8px; }
.art-option-grid--types { grid-template-columns:repeat(5,minmax(0,1fr)); }
.art-option-grid--layout { grid-template-columns:repeat(3,minmax(0,1fr)); }
.art-option-grid--layout-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.art-option-grid--sizes { grid-template-columns:repeat(5,minmax(0,1fr)); }
.art-option-grid--sizes-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }

.art-option { position:relative; display:grid; min-width:0; min-height:62px; place-items:center; align-content:center; gap:5px; padding:7px 5px; border:1px solid rgba(45,55,49,.12); border-radius:10px; background:#fff; color:var(--color-text); cursor:pointer; transition:border-color var(--transition),box-shadow var(--transition),transform var(--transition); }
.art-option:hover { transform:translateY(-1px); border-color:rgba(45,55,49,.28); }
.art-option.is-selected { border-color:#1f2421; box-shadow:inset 0 0 0 1px #1f2421; }
.art-option > img { width:36px; height:36px; object-fit:cover; border-radius:5px; }
.art-option > span:not(.art-layout-icon) { overflow:hidden; max-width:100%; font-size:9px; font-weight:650; line-height:1.1; text-align:center; text-overflow:ellipsis; }
.art-option > span small { display:block; margin-top:3px; color:var(--color-muted); font-size:8px; font-weight:500; line-height:1.15; }
.art-option__check { position:absolute; top:5px; right:5px; display:grid; width:16px; height:16px; place-items:center; border-radius:50%; background:#171a18; color:#fff; font-size:9px; font-style:normal; }
.art-option-grid--layout .art-option { min-height:70px; }
.art-option-grid--sizes .art-option { min-height:54px; }

.art-layout-icon { display:grid; width:30px; height:23px; gap:2px; }
.art-layout-icon--single { grid-template-columns:1fr; }
.art-layout-icon--two-squares { grid-template-columns:repeat(2,1fr); }
.art-layout-icon--three-portraits { grid-template-columns:repeat(3,1fr); }
.art-layout-icon--grid-four { grid-template-columns:repeat(2,1fr); grid-template-rows:repeat(2,1fr); }
.art-layout-icon i { display:block; border:1.4px solid currentColor; border-radius:1px; }

.art-material-groups { display:grid; gap:13px; }
.art-material-group h3 { margin-bottom:8px; color:var(--color-muted); font-size:12px; font-weight:650; }
.art-material-swatches { display:flex; align-items:flex-start; gap:14px; }
.art-material-swatch { position:relative; display:grid; width:50px; justify-items:center; gap:5px; padding:0; border:0; background:transparent; color:var(--color-text); cursor:pointer; }
.art-material-swatch > span { display:block; width:42px; height:42px; border:1px solid rgba(45,55,49,.13); border-radius:50%; background:var(--material-swatch); box-shadow:inset 0 1px 0 rgba(255,255,255,.48); }
.art-material-swatch small { font-size:9px; line-height:1.1; }
.art-material-swatch.is-selected > span { outline:2px solid #1f2421; outline-offset:3px; }
.art-material-swatch > i { position:absolute; top:-1px; right:1px; display:grid; width:16px; height:16px; place-items:center; border-radius:50%; background:#171a18; color:#fff; font-size:9px; font-style:normal; }

.art-quantity { display:grid; width:124px; height:40px; grid-template-columns:40px 44px 40px; overflow:hidden; border:1px solid rgba(45,55,49,.13); border-radius:10px; }
.art-quantity button { background:#fff; font-size:18px; cursor:pointer; }
.art-quantity output { display:grid; place-items:center; border-right:1px solid rgba(45,55,49,.1); border-left:1px solid rgba(45,55,49,.1); font-size:12px; font-weight:700; }

.art-collection-contents__items { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.art-collection-contents__items figure { min-width:0; }
.art-collection-contents__items img { width:100%; aspect-ratio:.72 / 1; object-fit:cover; border:1px solid rgba(45,55,49,.1); border-radius:5px; }
.art-collection-contents__items figcaption { display:none; }
.art-gallery-stage--contents .art-collection-contents__items { width:min(82%,760px); gap:16px; }
.art-gallery-stage--contents .art-collection-contents__items img { border:9px solid #bd8242; box-shadow:0 14px 28px rgba(30,36,32,.15); }

.art-configurator__checkout { display:grid; grid-template-columns:1fr minmax(190px,230px); align-items:center; gap:14px; padding:14px 18px; border-top:1px solid rgba(49,59,53,.10); background:rgba(255,255,255,.98); box-shadow:0 -12px 30px rgba(40,49,44,.045); }
.art-configurator__checkout > div { display:grid; }
.art-configurator__checkout small { color:var(--color-muted); font-size:10px; }
.art-configurator__checkout strong { font-size:24px; font-weight:650; letter-spacing:-.03em; }
.art-configurator__checkout .button { display:flex; min-height:48px; align-items:center; justify-content:center; gap:9px; border-radius:10px; }
.art-configurator__checkout .button svg { width:20px; height:20px; }

@media (max-width: 1240px) {
  .art-product-layout { grid-template-columns:minmax(0,1fr) 390px; gap:14px; }
  .artwork-gallery { grid-template-columns:76px minmax(0,1fr); height:min(690px,calc(100vh - var(--header-height) - 70px)); min-height:570px; }
  .art-gallery-thumb { flex-basis:74px; width:74px; height:74px; }
  .art-configurator { height:min(690px,calc(100vh - var(--header-height) - 70px)); min-height:570px; }
  .art-configurator__scroll { padding:18px 18px 24px; }
  .art-option-grid--types { grid-template-columns:repeat(5,minmax(0,1fr)); }
  .art-material-swatches { gap:10px; }
}

@media (max-width: 1020px) {
  .art-product-page { padding-top:10px; }
  .art-product-layout { grid-template-columns:minmax(0,1fr) 360px; }
  .artwork-gallery { grid-template-columns:68px minmax(0,1fr); height:630px; min-height:0; }
  .art-gallery-thumb { flex-basis:66px; width:66px; height:66px; border-radius:10px; }
  .art-configurator { position:sticky; height:630px; min-height:0; }
  .art-option-grid--types { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .art-option-grid--sizes { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .art-product-heading h1 { font-size:25px; }
}

@media (max-width: 900px) {
  .art-product-layout { display:block; }
  .artwork-gallery { height:640px; margin-bottom:16px; }
  .art-configurator { position:static; height:auto; min-height:0; }
  .art-configurator__scroll { overflow:visible; }
  .art-configurator__checkout { position:sticky; z-index:10; bottom:0; }
}

@media (max-width: 640px) {
  .art-product-shell { padding-right:12px; padding-left:12px; }
  .art-product-shell > .breadcrumb { margin-left:2px; }
  .artwork-gallery { grid-template-columns:1fr; grid-template-rows:minmax(0,1fr) 72px; height:580px; }
  .artwork-gallery__thumbnails { order:2; flex-direction:row; overflow-x:auto; overflow-y:hidden; }
  .art-gallery-thumb { flex:0 0 68px; width:68px; height:68px; }
  .artwork-gallery__main { order:1; border-radius:14px; }
  .art-gallery-room__placement--landscape { width:58vw; }
  .art-gallery-room__placement--portrait { width:34vw; }
  .art-gallery-room__placement--square { width:42vw; }
  .art-gallery-room__placement--collection { width:76vw; }
  .art-configurator { border-radius:14px; }
  .art-configurator__scroll { padding:20px 16px 24px; }
  .art-product-heading h1 { font-size:28px; }
  .art-option-grid--types { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .art-option-grid--layout,
  .art-option-grid--layout-2 { grid-template-columns:1fr 1fr; }
  .art-option-grid--sizes,
  .art-option-grid--sizes-4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .art-material-swatches { flex-wrap:wrap; }
  .art-configurator__checkout { grid-template-columns:1fr; }
  .art-configurator__checkout .button { width:100%; }
}
/* Commerce drawers */
.utility-link { position: relative; }
.utility-count {
  position: absolute;
  top: 1px;
  right: 0;
  display: grid;
  min-width: 17px;
  height: 17px;
  place-items: center;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--color-accent);
  color: #fff;
  font-size: 9px;
  font-weight: 760;
  line-height: 1;
}
.utility-count[hidden] { display: none; }

.commerce-backdrop {
  position: fixed;
  inset: 0;
  z-index: 250;
  background: rgba(24,30,26,.26);
  backdrop-filter: blur(3px);
}
.commerce-drawer {
  position: fixed;
  z-index: 260;
  top: 12px;
  right: 12px;
  bottom: 12px;
  display: grid;
  width: min(440px, calc(100vw - 24px));
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 26px;
  background: rgba(250,252,251,.93);
  box-shadow: 0 30px 100px rgba(20,29,24,.26), inset 0 1px 0 rgba(255,255,255,.92);
  backdrop-filter: blur(28px) saturate(145%);
}
.commerce-drawer__head,
.commerce-drawer__footer { padding: 22px; }
.commerce-drawer__head { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(49,59,53,.09); }
.commerce-drawer__head h2 { font-size: 25px; }
.commerce-drawer__close { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 50%; background: rgba(255,255,255,.7); cursor: pointer; }
.commerce-drawer__body { overflow-y: auto; padding: 12px 22px 22px; }
.commerce-drawer__footer { border-top: 1px solid rgba(49,59,53,.09); }
.commerce-line { display: grid; grid-template-columns: 84px minmax(0,1fr) auto; gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid rgba(49,59,53,.08); }
.commerce-line__image { aspect-ratio: 1 / 1; overflow: hidden; border-radius: 10px; background: #eeeae2; }
.commerce-line__image img { width: 100%; height: 100%; object-fit: cover; }
.commerce-line__content { min-width: 0; }
.commerce-line__content h3 { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.commerce-line__content p { margin-top: 4px; font-size: 11px; }
.commerce-line__content strong { display: block; margin-top: 6px; font-size: 13px; }
.commerce-line__remove { color: var(--color-muted); font-size: 12px; cursor: pointer; }
.commerce-empty { display: grid; min-height: 300px; place-items: center; align-content: center; gap: 12px; text-align: center; }
.commerce-empty p { max-width: 280px; }
.commerce-summary { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.commerce-summary strong { font-size: 22px; }

@media (min-width: 1500px) {
  .art-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 1180px) {
  .art-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .art-filter__chips { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; padding-bottom: 5px; scrollbar-width: none; }
  .art-filter__chips::-webkit-scrollbar { display: none; }
  .art-style-chip { flex: 0 0 auto; min-height: 48px; padding: 0 19px; }
  .art-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .art-discovery { padding-top: 16px; }
  .art-filter { padding: 20px 16px; border-radius: 20px; }
  .art-filter__title { text-align: left; }
  .art-toolbar { align-items: flex-start; flex-direction: column; }
  .art-toolbar__controls { width: 100%; justify-content: space-between; }
  .art-sort { min-width: 0; flex: 1; }
  .art-grid { gap: 20px 12px; }
  .art-card__body { display: grid; gap: 3px; }
  .art-card__body h2 { font-size: 14px; }
  .art-card__body p { font-size: 11px; }
  .art-card__wishlist { top: 8px; right: 8px; width: 36px; height: 36px; }
  .commerce-drawer { top: 0; right: 0; bottom: 0; width: 100%; border-radius: 0; }
}
