/* ─── Ürün Sayfası ────────────────────────────────────────────
 * Ported from the Claude Design file "Urun Sayfasi.dc.html". Values are the
 * design's; type moved out of inline styles because the build only rewrites
 * font-family names in stylesheets. Display leading is 1.14 where the design
 * had .88–1: Turkish İ/Ş clip below that.
 */
.cc_pfQKlERh3P_APfMi3FPHZ .up, .cc_pfQKlERh3P_APfMi3FPHZ .up * { box-sizing: border-box; }
.cc_pfQKlERh3P_APfMi3FPHZ .up a { color: inherit; text-decoration: none; }
.cc_pfQKlERh3P_APfMi3FPHZ .up button { -webkit-tap-highlight-color: transparent; }

@keyframes cc_pfQKlERh3P_APfMi3FPHZ_up-rise { from { transform: translateY(14px); opacity: 0 } to { transform: translateY(0); opacity: 1 } }
@keyframes cc_pfQKlERh3P_APfMi3FPHZ_up-pulse { 0% { box-shadow: 0 0 0 0 rgba(36,83,255,.55) } 100% { box-shadow: 0 0 0 14px rgba(36,83,255,0) } }
@keyframes cc_pfQKlERh3P_APfMi3FPHZ_up-ghost { from { transform: translateY(16px); opacity: 0 } to { transform: translateY(0); opacity: 1 } }
@keyframes cc_pfQKlERh3P_APfMi3FPHZ_up-marquee { 0% { transform: translateX(0) } 100% { transform: translateX(-50%) } }

.cc_pfQKlERh3P_APfMi3FPHZ .up {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono', monospace;
  -webkit-font-smoothing: antialiased;
  width: 100%; display: flex; justify-content: center;
  background: #0d0d0c; color: #0d0d0c;
}
.cc_pfQKlERh3P_APfMi3FPHZ .up-shell { position: relative; width: 100%; background: #eceae5; padding-bottom: 120px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up { --up-padx: 16px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide { --up-padx: 40px; }

.cc_pfQKlERh3P_APfMi3FPHZ .up-bs {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Big Shoulders Display', sans-serif;
  font-weight: 900; text-transform: uppercase;
}
.cc_pfQKlERh3P_APfMi3FPHZ .up-mono {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono', monospace;
  font-weight: 500;
}
.cc_pfQKlERh3P_APfMi3FPHZ .up-mono6 {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono', monospace;
  font-weight: 600;
}
.cc_pfQKlERh3P_APfMi3FPHZ .up-sg {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Space Grotesk', sans-serif;
  font-weight: 400;
}

/* header — sticky in page flow; the design pinned it above an inner scroll */
.cc_pfQKlERh3P_APfMi3FPHZ .up-head { position: sticky; top: 0; z-index: 30; background: #0d0d0c; color: #f4f3f0; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-headrow { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 14px var(--up-padx) 12px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-back { display: flex; align-items: center; gap: 9px; border: 0; background: transparent; color: inherit; padding: 0; cursor: pointer; min-width: 0; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-back:hover { opacity: .7; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-back-icon { width: 32px; height: 32px; flex: none; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(244,243,240,.3); border-radius: 999px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-crumb { font-size: 10px; line-height: 1.14; letter-spacing: .16em; text-transform: uppercase; color: #f4f3f0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-share { flex: none; font-size: 9px; line-height: 1; letter-spacing: .12em; text-transform: uppercase; border: 1px solid rgba(244,243,240,.3); background: transparent; color: inherit; border-radius: 999px; padding: 9px 13px 9px calc(13px + .12em); cursor: pointer; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-share:hover { background: rgba(244,243,240,.1); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-hint { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 var(--up-padx); padding: 11px 0 12px; border-top: 1px solid rgba(244,243,240,.12); font-size: 9px; line-height: 1; letter-spacing: .14em; text-transform: uppercase; color: rgba(244,243,240,.42); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-hint-arrow { display: inline-block; font-size: 15px; line-height: 9px; vertical-align: middle; transform: translateY(-1px); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-hint-index { flex: none; letter-spacing: .1em; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-marquee { background: #2453ff; color: #f4f3f0; padding: 10px 0; overflow: hidden; white-space: nowrap; font-size: 9px; line-height: 1; letter-spacing: .16em; text-transform: uppercase; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-marquee-track { display: inline-block; animation: cc_pfQKlERh3P_APfMi3FPHZ_up-marquee 30s linear infinite; }

/* top: gallery + info */
.cc_pfQKlERh3P_APfMi3FPHZ .up-top { display: flex; flex-direction: column; align-items: flex-start; }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-top { flex-direction: row; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-gallery { width: 100%; min-width: 0; border-bottom: 1px solid rgba(13,13,12,.14); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-gallery { flex: 0 0 56%; align-self: stretch; position: sticky; top: 120px; border-right: 1px solid rgba(13,13,12,.14); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-gal-box { position: relative; width: 100%; aspect-ratio: 1 / 1; overflow: hidden; }
/* Height-driven on desktop, not width-driven.
   The gallery column is 56% of the page, so at 1440 the box was about 762px
   wide and 4:5 made it 950px tall — taller than the viewport it is sticky
   inside, so the product could not be seen without scrolling, which is the one
   thing a product page must not ask.
   Setting the height and letting the ratio produce the width caps it at one
   screen: 100svh less the sticky offset and the room the page furniture needs
   below it. It is centred because at that cap the box is narrower than its
   column. */
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-gal-box {
  aspect-ratio: 4 / 5;
  height: min(calc(100svh - 190px), 760px);
  width: auto;
  max-width: 100%;
  margin: 0 auto;
}
.cc_pfQKlERh3P_APfMi3FPHZ .up-ghost { position: absolute; left: 0; right: 0; bottom: 7%; text-align: center; line-height: .8; letter-spacing: -.03em; color: rgba(13,13,12,.13); white-space: nowrap; transition: opacity .3s; animation: cc_pfQKlERh3P_APfMi3FPHZ_up-ghost .5s ease-out; }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-ghost { bottom: 9%; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-ghost.is-sale { color: rgba(36,83,255,.24); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-gal { position: absolute; inset: 0; display: flex; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; scroll-snap-type: x mandatory; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-gal::-webkit-scrollbar { display: none; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-slide { flex: none; width: 100%; height: 100%; scroll-snap-align: center; position: relative; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-slide-img { position: absolute; top: 4%; bottom: 4%; left: 8%; right: 8%; }

/* The low-resolution stand-in, directly behind the real photograph and in the
   same box. Cutout's .ka-cut-in is transparent until it has something to show,
   so this is simply visible through it and then covered — no swap, no flicker,
   nothing to co-ordinate. Sized and positioned to match .ka-cut-in.is-plain
   exactly, or the product would visibly shift as the full file arrives. */
.cc_pfQKlERh3P_APfMi3FPHZ .up-slide-lqip {
  position: absolute;
  top: 4%;
  bottom: 4%;
  left: 8%;
  right: 8%;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  pointer-events: none;
}
.cc_pfQKlERh3P_APfMi3FPHZ .up .up-slide .ka-cut.is-bleed { top: 0; bottom: 0; left: 0; right: 0; }
.cc_pfQKlERh3P_APfMi3FPHZ .up .up-slide-img .ka-cut-in { background-position: center; }
.cc_pfQKlERh3P_APfMi3FPHZ .up .ka-cut.up-slide-img { align-items: center; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-dots { position: absolute; left: 0; right: 0; bottom: 8px; display: flex; justify-content: center; gap: 5px; pointer-events: none; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-dot { width: 4px; height: 4px; border-radius: 2px; background: rgba(13,13,12,.22); transition: width .25s, background .25s; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-dot.is-on { width: 20px; background: rgba(13,13,12,.75); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-off { position: absolute; right: 12px; top: 12px; background: #2453ff; color: #f4f3f0; font-size: 21px; line-height: 1; letter-spacing: .06em; padding: 9px 14px; border-radius: 999px; z-index: 2; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-save { position: absolute; right: 12px; bottom: 14px; z-index: 2; width: 42px; height: 42px; border-radius: 999px; border: 1px solid rgba(13,13,12,.16); background: rgba(244,243,240,.85); color: rgba(13,13,12,.6); display: flex; align-items: center; justify-content: center; padding: 0; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-save.is-on { background: #2453ff; color: #f4f3f0; border-color: #2453ff; animation: cc_pfQKlERh3P_APfMi3FPHZ_up-pulse .7s ease-out; }

.cc_pfQKlERh3P_APfMi3FPHZ .up-info { width: 100%; min-width: 0; padding: 18px var(--up-padx) 0; }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-info { flex: 1; }
/* No top margin: the 9px was the gap under the brand line, and the name is the
   first thing in the info column now. */
.cc_pfQKlERh3P_APfMi3FPHZ .up-name { margin: 0; font-size: 40px; line-height: 1.14; letter-spacing: .01em; text-wrap: pretty; }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-name { font-size: 54px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-prices { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-was { font-size: 15px; line-height: 1; color: rgba(13,13,12,.42); text-decoration: line-through; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-price { font-size: 26px; line-height: 1; letter-spacing: -.01em; color: #0d0d0c; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-price.is-sale { color: #2453ff; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-chip { font-size: 9px; line-height: 1; letter-spacing: .12em; text-transform: uppercase; border: 1px solid rgba(13,13,12,.2); border-radius: 999px; padding: 8px 11px; color: rgba(13,13,12,.65); }

.cc_pfQKlERh3P_APfMi3FPHZ .up-sizehead { margin-top: 24px; display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-label { font-size: 9px; line-height: 1; letter-spacing: .16em; text-transform: uppercase; color: rgba(13,13,12,.45); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-guide { flex: none; border: 0; background: transparent; padding: 0; font-size: 10px; line-height: 1; letter-spacing: .06em; text-decoration: underline; text-underline-offset: 3px; color: rgba(13,13,12,.6); cursor: pointer; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-sizes { display: grid; gap: 6px; margin-top: 10px; border-radius: 12px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-sizes.is-need { animation: cc_pfQKlERh3P_APfMi3FPHZ_up-pulse .7s ease-out; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-size { height: 52px; border: 1px solid rgba(13,13,12,.22); background: rgba(255,255,255,.55); color: #0d0d0c; border-radius: 10px; font-size: 19px; line-height: 1; letter-spacing: .04em; cursor: pointer; transition: transform .18s, background .18s, color .18s; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-size.is-on { background: #0d0d0c; color: #f4f3f0; border-color: #0d0d0c; transform: scale(1.04); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-size.is-out { color: rgba(13,13,12,.3); border-color: rgba(13,13,12,.12); text-decoration: line-through; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-stock { margin-top: 9px; font-size: 12px; line-height: 1.5; color: rgba(13,13,12,.55); }

.cc_pfQKlERh3P_APfMi3FPHZ .up-buyrow { display: flex; gap: 8px; margin-top: 16px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-buy { flex: 1; min-width: 0; height: 56px; border: 0; border-radius: 999px; background: #0d0d0c; color: #f4f3f0; font-size: 12px; line-height: 1; letter-spacing: .12em; padding-left: .12em; text-transform: uppercase; cursor: pointer; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-buy:hover { opacity: .88; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-buy.is-ready { background: #2453ff; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-whats { flex: none; width: 56px; height: 56px; border: 1px solid rgba(13,13,12,.22); background: transparent; color: #0d0d0c; border-radius: 999px; display: flex; align-items: center; justify-content: center; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-whats:hover { background: rgba(13,13,12,.06); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-delivery { margin-top: 11px; font-size: 9px; line-height: 1.5; letter-spacing: .1em; text-transform: uppercase; color: rgba(13,13,12,.45); }

.cc_pfQKlERh3P_APfMi3FPHZ .up-acc { margin-top: 26px; border-top: 1px solid rgba(13,13,12,.14); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-acc-item { border-bottom: 1px solid rgba(13,13,12,.14); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-acc-btn { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 10px; background: transparent; border: 0; padding: 16px 0; font-size: 21px; line-height: 1.14; letter-spacing: .03em; cursor: pointer; color: inherit; text-align: left; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-acc-icon { flex: none; font-weight: 400; font-size: 18px; color: rgba(13,13,12,.5); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-acc-body { padding: 0 0 18px; font-size: 13px; line-height: 1.6; color: rgba(13,13,12,.75); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-acc-body p { margin: 0 0 .6em; }

/* The theme's button rules reach these (text-align, padding), so a <button>
   cannot be trusted to centre its own label. Centre explicitly; the
   letter-spacing trail is cancelled with padding-left equal to the spacing. */
.cc_pfQKlERh3P_APfMi3FPHZ .up .up-size, .cc_pfQKlERh3P_APfMi3FPHZ .up .up-buy, .cc_pfQKlERh3P_APfMi3FPHZ .up .up-share {
  display: flex; align-items: center; justify-content: center; text-align: center;
}
.cc_pfQKlERh3P_APfMi3FPHZ .up .up-size { padding: 0 0 0 .04em; }
.cc_pfQKlERh3P_APfMi3FPHZ .up .up-buy { padding: 0 0 0 .12em; }

/* complete the look */
.cc_pfQKlERh3P_APfMi3FPHZ .up-look { background: #0d0d0c; color: #f4f3f0; padding: 26px 0 28px; margin-top: 26px; border-top: 1px solid rgba(13,13,12,.14); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-sechead { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 0 var(--up-padx); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-sechead--paper { padding: 24px var(--up-padx) 14px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-sectitle { font-size: 30px; line-height: 1.14; letter-spacing: .01em; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-secmeta { flex: none; font-size: 9px; line-height: 1; letter-spacing: .16em; text-transform: uppercase; color: rgba(244,243,240,.45); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-similar .up-secmeta { color: rgba(13,13,12,.45); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-lookrail { display: flex; gap: 10px; overflow-x: auto; scrollbar-width: none; padding: 16px var(--up-padx) 2px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-lookrail::-webkit-scrollbar { display: none; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-lookcard { flex: none; width: 148px; display: block; }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-lookcard { width: 210px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-lookcard:hover { opacity: .85; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-lookimg { position: relative; display: block; aspect-ratio: 1; background: #eceae5; border-radius: 8px; overflow: hidden; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-lookimg-in { position: absolute; inset: 6%; }
.cc_pfQKlERh3P_APfMi3FPHZ .up .ka-cut.up-lookimg-in, .cc_pfQKlERh3P_APfMi3FPHZ .up .ka-cut.up-cell-img { align-items: center; }
.cc_pfQKlERh3P_APfMi3FPHZ .up .up-lookimg-in .ka-cut-in, .cc_pfQKlERh3P_APfMi3FPHZ .up .up-cell-img .ka-cut-in { background-position: center; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-lookbrand { display: block; margin-top: 9px; font-size: calc(17px * var(--brand-fit, 1)); line-height: 1.14; letter-spacing: .02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-lookname { display: block; margin-top: 5px; font-size: 9px; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; color: rgba(244,243,240,.5); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-lookprice { display: block; margin-top: 6px; font-size: 11px; line-height: 1; color: rgba(244,243,240,.7); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-lookprice.is-sale { color: #2453ff; }

/* similar grid */
.cc_pfQKlERh3P_APfMi3FPHZ .up-similar { background: #eceae5; color: #0d0d0c; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid rgba(13,13,12,.14); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell { position: relative; min-width: 0; display: flex; flex-direction: column; padding: 10px 12px 12px; border-right: 1px solid rgba(13,13,12,.14); border-bottom: 1px solid rgba(13,13,12,.14); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell:hover { background: rgba(13,13,12,.03); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; font-size: 9px; line-height: 1; letter-spacing: .14em; color: rgba(13,13,12,.4); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell-cat { flex: none; letter-spacing: .1em; text-transform: uppercase; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell-media { position: relative; aspect-ratio: 1; margin-top: 6px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell-img { position: absolute; inset: 4%; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell-info { margin-top: 8px; padding-top: 7px; border-top: 1px solid rgba(13,13,12,.14); min-width: 0; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell-row { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; min-width: 0; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell-brand { min-width: 0; font-size: calc(18px * var(--brand-fit, 1)); line-height: 1.14; letter-spacing: .02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell-price { flex: none; font-size: 13px; line-height: 1; color: rgba(13,13,12,.6); }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell-price.is-sale { color: #2453ff; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-cell-name { margin-top: 5px; font-size: 9px; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; color: rgba(13,13,12,.5); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* fly + toast: fixed, since the page scrolls */
.cc_pfQKlERh3P_APfMi3FPHZ .up-fly { position: fixed; z-index: 45; pointer-events: none; left: 16%; right: 16%; top: 14vh; height: 45vh; background-size: contain; background-position: center; background-repeat: no-repeat; transition: transform .58s cubic-bezier(.5,0,.3,1), opacity .58s; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-toastrow { position: fixed; left: 0; right: 0; bottom: 120px; z-index: 46; display: flex; justify-content: center; pointer-events: none; padding: 0 16px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-toast { background: #f4f3f0; color: #0d0d0c; border-radius: 999px; padding: 11px 18px; font-size: 10px; line-height: 1.14; letter-spacing: .12em; text-transform: uppercase; text-align: center; animation: cc_pfQKlERh3P_APfMi3FPHZ_up-rise .3s ease-out; box-shadow: 0 12px 30px -12px rgba(0,0,0,.6); }

/* vietnamese */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Big Shoulders Display';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/bigshouldersdisplay/v24/fC1MPZJEZG-e9gHhdI4-NBbfd2ys3SjJCx12wPgf9g-_3F0YdSY8FFYwSDH92ZWI0g5D.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Big Shoulders Display';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/bigshouldersdisplay/v24/fC1MPZJEZG-e9gHhdI4-NBbfd2ys3SjJCx12wPgf9g-_3F0YdSY8FFcwSDH92ZWI0g5D.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Big Shoulders Display';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/bigshouldersdisplay/v24/fC1MPZJEZG-e9gHhdI4-NBbfd2ys3SjJCx12wPgf9g-_3F0YdSY8FFkwSDH92ZWI0g.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx3cwgknk-6nFg.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxTcwgknk-6nFg.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxPcwgknk-6nFg.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx_cwgknk-6nFg.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx7cwgknk-6nFg.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxDcwgknk-4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx3cwgknk-6nFg.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxTcwgknk-6nFg.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxPcwgknk-6nFg.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx_cwgknk-6nFg.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx7cwgknk-6nFg.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxDcwgknk-4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Space Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/spacegrotesk/v22/V8mDoQDjQSkFtoMM3T6r8E7mPb54C_k3HqUtEw.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Space Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/spacegrotesk/v22/V8mDoQDjQSkFtoMM3T6r8E7mPb94C_k3HqUtEw.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Space Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/spacegrotesk/v22/V8mDoQDjQSkFtoMM3T6r8E7mPbF4C_k3HqU.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/spacegrotesk/v22/V8mDoQDjQSkFtoMM3T6r8E7mPb54C_k3HqUtEw.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/spacegrotesk/v22/V8mDoQDjQSkFtoMM3T6r8E7mPb94C_k3HqUtEw.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/spacegrotesk/v22/V8mDoQDjQSkFtoMM3T6r8E7mPbF4C_k3HqU.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ─── Desktop scale (generated from the rules above) ──────────
 * Every px size on a wide section is its phone value times --up-s (1 at a
 * 1280 section, growing with the width — set in index.tsx). Where the design
 * already had a desktop value it is divided by 1.5, so 1280 lands exactly on
 * it. Hairlines (<=2px) do not scale. Regenerate (scripts/desktop-scale*.py) rather than hand-edit.
 */
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-shell { padding-bottom: calc(120.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-headrow { gap: calc(10.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-back { gap: calc(9.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-back-icon { width: calc(32.0px * var(--up-s)); height: calc(32.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-crumb { font-size: calc(10.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-share { font-size: calc(9.0px * var(--up-s)); padding: calc(9.0px * var(--up-s)) calc(13.0px * var(--up-s)) calc(9.0px * var(--up-s)) calc(calc(13.0px * var(--up-s)) + .12em); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-hint { gap: calc(12.0px * var(--up-s)); padding: calc(11.0px * var(--up-s)) 0 calc(12.0px * var(--up-s)); font-size: calc(9.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-hint-arrow { font-size: calc(15.0px * var(--up-s)); line-height: calc(9.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-marquee { padding: calc(10.0px * var(--up-s)) 0; font-size: calc(9.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-dots { bottom: calc(8.0px * var(--up-s)); gap: calc(5.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-dot { width: calc(4.0px * var(--up-s)); height: calc(4.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-dot.is-on { width: calc(20.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-off { right: calc(12.0px * var(--up-s)); top: calc(12.0px * var(--up-s)); font-size: calc(21.0px * var(--up-s)); padding: calc(9.0px * var(--up-s)) calc(14.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-save { right: calc(12.0px * var(--up-s)); bottom: calc(14.0px * var(--up-s)); width: calc(42.0px * var(--up-s)); height: calc(42.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-name { margin: 0; font-size: calc(54px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-prices { gap: calc(10.0px * var(--up-s)); margin-top: calc(14.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-was { font-size: calc(15.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-price { font-size: calc(26.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-chips { gap: calc(6.0px * var(--up-s)); margin-top: calc(16.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-chip { font-size: calc(9.0px * var(--up-s)); padding: calc(8.0px * var(--up-s)) calc(11.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-sizehead { margin-top: calc(24.0px * var(--up-s)); gap: calc(10.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-label { font-size: calc(9.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-guide { font-size: calc(10.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-sizes { gap: calc(6.0px * var(--up-s)); margin-top: calc(10.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-size { height: calc(52.0px * var(--up-s)); font-size: calc(19.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-stock { margin-top: calc(9.0px * var(--up-s)); font-size: calc(12.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-buyrow { gap: calc(8.0px * var(--up-s)); margin-top: calc(16.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-buy { height: calc(56.0px * var(--up-s)); font-size: calc(12.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-whats { width: calc(56.0px * var(--up-s)); height: calc(56.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-delivery { margin-top: calc(11.0px * var(--up-s)); font-size: calc(9.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-acc { margin-top: calc(26.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-acc-btn { gap: calc(10.0px * var(--up-s)); padding: calc(16.0px * var(--up-s)) 0; font-size: calc(21.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-acc-icon { font-size: calc(18.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-acc-body { padding: 0 0 calc(18.0px * var(--up-s)); font-size: calc(13.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-look { padding: calc(26.0px * var(--up-s)) 0 calc(28.0px * var(--up-s)); margin-top: calc(26.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-sechead { gap: calc(12.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-sectitle { font-size: calc(30.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-secmeta { font-size: calc(9.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-lookrail { gap: calc(10.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-lookcard { width: calc(210px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-lookbrand { margin-top: calc(9.0px * var(--up-s)); font-size: calc(17.0px * var(--up-s) * var(--brand-fit, 1)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-lookname { margin-top: calc(5.0px * var(--up-s)); font-size: calc(9.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-lookprice { margin-top: calc(6.0px * var(--up-s)); font-size: calc(11.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-cell { padding: calc(10.0px * var(--up-s)) calc(12.0px * var(--up-s)) calc(12.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-cell-top { gap: calc(8.0px * var(--up-s)); font-size: calc(9.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-cell-media { margin-top: calc(6.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-cell-info { margin-top: calc(8.0px * var(--up-s)); padding-top: calc(7.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-cell-row { gap: calc(8.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-cell-brand { font-size: calc(18.0px * var(--up-s) * var(--brand-fit, 1)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-cell-price { font-size: calc(13.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-cell-name { margin-top: calc(5.0px * var(--up-s)); font-size: calc(9.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-toastrow { bottom: calc(120.0px * var(--up-s)); padding: 0 calc(16.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-toast { padding: calc(11.0px * var(--up-s)) calc(18.0px * var(--up-s)); font-size: calc(10.0px * var(--up-s)); }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-gallery { top: calc(120px * var(--up-s)); }

/* Tablet: bars and grounds run full width; the content is held to a 680px
   middle by --up-cap, the same as the category page. */
.cc_pfQKlERh3P_APfMi3FPHZ .up:not(.is-wide) {
  --up-cap: max(0px, calc((100vw - 680px) / 2));
  --up-padx: calc(16px + var(--up-cap));
}
/* Stretched, not width: 100% — at 100% the margin pushed the gallery past the
   right edge (.up-top does not stretch its children). */
.cc_pfQKlERh3P_APfMi3FPHZ .up:not(.is-wide) .up-gallery { width: auto; align-self: stretch; margin: 0 var(--up-cap); }
.cc_pfQKlERh3P_APfMi3FPHZ .up:not(.is-wide) .up-grid { margin: 0 var(--up-cap); }

/* Colour, under the sizes: circles rather than chips, because a colourway is
   a thing you look at and a size is a thing you read. */
.cc_pfQKlERh3P_APfMi3FPHZ .up-colors { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-color { width: 34px; height: 34px; border-radius: 999px; border: 1px solid rgba(13,13,12,.22); padding: 0; cursor: pointer; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-color.is-on { box-shadow: 0 0 0 2px #eceae5, 0 0 0 3px #0d0d0c; }
.cc_pfQKlERh3P_APfMi3FPHZ .up-color.is-out { opacity: .4; }
.cc_pfQKlERh3P_APfMi3FPHZ .up.is-wide .up-color { width: calc(34px * var(--up-s)); height: calc(34px * var(--up-s)); }

/* Group swatches carry the sibling product's photo — a RENK group value has no
   colour code behind it. */
.cc_pfQKlERh3P_APfMi3FPHZ .up-color--img { background-size: cover; background-position: center; background-color: #eceae5; display: block; }

/* ---- gallery arrows, desktop only --------------------------------------
   See the matching block in ProductListSection. The gallery is a scroll-snap
   track built for a thumb; with a mouse there was no way past the first photo.
   `hover: hover` + `pointer: fine` rather than a width query, so a touch laptop
   keeps the gesture and does not get arrows fighting it. */
.cc_pfQKlERh3P_APfMi3FPHZ .up-arrow { display: none; }

@media (hover: hover) and (pointer: fine) {
  .cc_pfQKlERh3P_APfMi3FPHZ .up-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(240, 239, 235, 0.88);
    color: #0d0d0c;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.14s ease-out, background 0.14s ease-out;
  }
  .cc_pfQKlERh3P_APfMi3FPHZ .up-arrow--prev { left: 12px; }
  .cc_pfQKlERh3P_APfMi3FPHZ .up-arrow--next { right: 12px; }
  .cc_pfQKlERh3P_APfMi3FPHZ .up-gal-box:hover .up-arrow { opacity: 1; }
  .cc_pfQKlERh3P_APfMi3FPHZ .up-arrow:hover { background: #f0efeb; }
  .cc_pfQKlERh3P_APfMi3FPHZ .up-arrow:focus-visible { opacity: 1; outline: 2px solid #0d0d0c; outline-offset: 2px; }
}

/* ---- desktop hold --------------------------------------------------------
   The page renders the phone layout until it has measured its own width, then
   switches to the desktop one: Google measured that switch as a layout shift of
   0.53 on desktop. On a desktop-width screen the page stays invisible until it
   has measured, so the first thing shown is the right layout. Phones are
   unaffected. The animation reveals it after 3s regardless, so no failure can
   leave the page hidden. This rule targets the section's root, which scoped
   component CSS cannot reach; it works through the inline copy (inlineCss.ts). */
@media (min-width: 1024px) {
  .cc_pfQKlERh3P_APfMi3FPHZ .up:not(.is-measured) { visibility: hidden; animation: cc_pfQKlERh3P_APfMi3FPHZ_up-reveal 0s linear 3s forwards; }
}
@keyframes cc_pfQKlERh3P_APfMi3FPHZ_up-reveal { to { visibility: visible; } }

/* Size chart content inside the Sheet primitive. The shell belongs to
   sub-components/Sheet; nothing here positions or paints the sheet. */

/* Column count is merchant-driven free-form text, so extra or long columns
   would otherwise crush the cells inside an overflow:hidden sheet. */
.cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-scroller {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-scroller::-webkit-scrollbar {
  display: none;
}

.cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-table {
  width: 100%;
  min-width: 320px;
  border-collapse: collapse;
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 500;
  font-size: 12px;
}

.cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-table th {
  text-align: left;
  padding: 9px 6px;
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  opacity: 0.5;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

.cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-table td {
  padding: 11px 6px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* The size itself is display type; the measurements are data. */
.cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-table td:first-child {
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Big Shoulders Display', Impact, 'Arial Narrow', sans-serif;
  font-weight: 900;
  font-size: 17px;
  line-height: var(--dh-lh-tight);
}

.cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-note {
  margin: 14px 0 0;
  font-family: 'cc_pfQKlERh3P_APfMi3FPHZ_Space Grotesk', -apple-system, 'Helvetica Neue', Arial, sans-serif;
  font-size: 11px;
  line-height: 1.5;
  opacity: 0.5;
}

/* ─── Desktop scale (generated) ───────────────────────────────
 * Every px size is its phone value (or the desktop value above where one
 * exists), fixed — not grown with the width. Uniform growth read as a zoomed
 * phone rather than a desktop layout. Hairlines (<=2px) and
 * safe-area padding do not scale. Regenerate (scripts/desktop-scale*.py) rather than hand-edit.
 */
@media (min-width: 768px) {
  .cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-table { min-width: 352px; font-size: 13.2px; }
  .cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-table th { padding: 7.6px 6.6px; font-size: 11px; }
  .cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-table td { padding: 9.3px 6.6px; }
  .cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-table td:first-child { font-size: 18.6px; }
  .cc_pfQKlERh3P_APfMi3FPHZ .size-sheet-note { margin: 15.4px 0 0; font-size: 12px; }
}