/* Orchid v463: true edge-to-edge media, touch-first Reels, and compact role pages. */

/* CMS artwork owns the whole banner rectangle. Reset the shared content
   container gutters on the banner itself, not on the content below it. */
html body #discover .shopper-live-banner.orchid-responsive-banner,
html body #discover [data-shopper-live-banner].orchid-responsive-banner {
  position:relative!important;
  box-sizing:border-box!important;
  width:100vw!important;
  max-width:none!important;
  margin:0 calc(50% - 50vw)!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:#07110e!important;
  overflow:hidden!important;
}
html body #discover [data-shopper-live-banner].orchid-responsive-banner > .orchid-banner-creative,
html body #discover [data-shopper-live-banner].orchid-responsive-banner > .orchid-banner-creative > .orchid-banner-layer {
  position:absolute!important;
  inset:0!important;
  display:block!important;
  box-sizing:border-box!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
}
html body #discover [data-shopper-live-banner].orchid-responsive-banner .orchid-banner-layer {
  object-fit:cover;
  object-position:center;
}

/* Brands start immediately below the site header in every auth state. */
html body.page-brands #brands,
html body.page-brands #brands > .brand-public:not(.is-hidden),
html body.page-brands #brands > .brand-dashboard:not(.is-hidden) {
  box-sizing:border-box!important;
  min-height:0!important;
  margin-top:0!important;
  padding-top:0!important;
}
html body.page-brands #brands {padding:0!important;align-content:start!important;}
html body.page-brands #brands > .brand-public:not(.is-hidden) {
  width:100vw!important;
  max-width:none!important;
  margin-inline:calc(50% - 50vw)!important;
  padding-inline:0!important;
}
html body.page-brands #brands .brand-intro-hero {
  width:100vw!important;
  max-width:none!important;
  min-height:clamp(500px,64vw,760px)!important;
  height:clamp(500px,64vw,760px)!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:#07110e!important;
}
html body.page-brands #brands .brand-intro-hero :is(.orchid-banner-creative,.orchid-banner-layer) {
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  margin:0!important;
  border-radius:0!important;
}
html body.page-brands #brands .brand-intro-hero > picture,
html body.page-brands #brands .brand-intro-hero > picture > img {
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:0!important;
}
html body.page-brands #brands > .brand-dashboard:not(.is-hidden) {
  align-self:start!important;
  padding-block:18px 42px!important;
}

/* Shopper Reels is one centred circular access point on a #121314 field. */
html body .orchid-video-rail[data-orchid-video-revision="v463"] {
  display:grid!important;
  grid-template-columns:1fr!important;
  place-items:center!important;
  box-sizing:border-box!important;
  width:100vw!important;
  max-width:none!important;
  min-height:224px!important;
  margin:0 calc(50% - 50vw)!important;
  padding:28px!important;
  border:0!important;
  border-radius:0!important;
  background:#121314!important;
  background-image:none!important;
}
html body .orchid-video-rail[data-orchid-video-revision="v463"] .orchid-video-rail__head,
html body .orchid-video-rail[data-orchid-video-revision="v463"] .orchid-video-access__button > :is(strong,small) {display:none!important;}
html body .orchid-video-rail[data-orchid-video-revision="v463"] .orchid-video-access,
html body .orchid-video-rail[data-orchid-video-revision="v463"] .orchid-video-access__button {
  display:grid!important;
  place-items:center!important;
  width:170px!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* Auto-moving commerce rails yield immediately to a finger gesture. */
html body :is([data-commerce-rail],.discover-rail,.public-creator-collections-row,.public-creator-collection-products,.brand-featured-rail) {
  touch-action:pan-x pan-y!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-inline:contain!important;
}

/* Reels navigate vertically. The obsolete story/loading bars are never
   painted; the seek bar at the bottom remains available for min/sec control. */
html body .orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-viewer__progress {display:none!important;}
html body .orchid-video-viewer[data-orchid-video-revision="v463"],
html body .orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-viewer__stage,
html body .orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-viewer__media {
  touch-action:pan-y!important;
  overscroll-behavior:contain!important;
}
html body .orchid-video-viewer.orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-viewer__head.orchid-video-viewer__head {
  width:auto!important;
  min-width:0!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  pointer-events:none!important;
}
html body .orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-viewer__head .orchid-video-viewer__close {pointer-events:auto!important;}
html body .orchid-video-viewer.orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-viewer__stage :is(.orchid-video-viewer__tabs,.orchid-video-viewer__actions,.orchid-video-viewer__bottom,.orchid-video-viewer__creator-row,.orchid-video-viewer__vertical-nav) {
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
}
html body .orchid-video-viewer.orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-viewer__actions :is(button,.orchid-video-viewer__metric) {
  display:grid!important;
  visibility:visible!important;
  opacity:1!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
html body .orchid-video-viewer.orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-viewer__actions svg,
html body .orchid-video-viewer.orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-viewer__actions svg :is(path,circle,rect,line,polyline) {
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
  vector-effect:non-scaling-stroke;
}
html body .orchid-video-viewer[data-orchid-video-revision="v463"] [data-video-shop] svg {color:#58efb3!important;}
html body .orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-appbar {
  grid-template-columns:minmax(260px,650px)!important;
  justify-content:center!important;
}
html body .orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-appbar > a {
  display:block!important;
  padding:12px 16px!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:8px!important;
  color:rgba(255,255,255,.62)!important;
  background:rgba(255,255,255,.06)!important;
  text-decoration:none!important;
  font:500 13px/1.2 Arial,sans-serif!important;
}
html body .orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-sidebar > :is(a,b) {
  display:block!important;
  margin:2px 0!important;
  padding:14px 17px!important;
  border-radius:10px!important;
  color:#ddd!important;
  -webkit-text-fill-color:#ddd!important;
  text-decoration:none!important;
  font:500 13px/1 Arial,sans-serif!important;
}
html body .orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-sidebar > b {
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:rgba(255,255,255,.13)!important;
}
html body .orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-brand {
  margin:0 10px 32px!important;
  padding:0!important;
  background:transparent!important;
}
html body .orchid-video-viewer[data-orchid-video-revision="v463"] .orchid-video-brand img {
  display:block!important;
  width:116px!important;
  height:auto!important;
  filter:invert(1)!important;
}
html body .orchid-video-sheet[data-orchid-video-revision="v463"] .orchid-video-product {
  text-decoration:none!important;
  touch-action:manipulation!important;
}

/* Product and collection rails pause their auto motion at the first finger
   gesture and retain native horizontal pan momentum on phones. */
html body :is(.discover-rail,.public-creator-collections-row,.public-creator-collection-products,.brand-featured-rail,[data-commerce-rail]) {
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-inline:contain!important;
  touch-action:pan-x pan-y!important;
  scroll-snap-type:x proximity!important;
}

@media(max-width:760px) {
  html body.page-brands #brands .brand-intro-hero {
    min-height:500px!important;
    height:500px!important;
  }
  html body .orchid-video-rail[data-orchid-video-revision="v463"] {
    min-height:190px!important;
    padding:24px!important;
  }
  html body .orchid-video-rail[data-orchid-video-revision="v463"] .orchid-video-access__button {width:124px!important;}
  html body .orchid-video-rail[data-orchid-video-revision="v463"] .orchid-video-access__ring {width:112px!important;height:112px!important;padding:4px!important;}
  html body .orchid-video-rail[data-orchid-video-revision="v463"] .orchid-video-access__ring > :is(img,span) {width:104px!important;height:104px!important;}
}
