@charset "utf-8";
.coupon {
  display: flex;
  flex-direction: column;
  gap: var(--spacing);
  padding: var(--spacing);
  border-radius: 1em;
  color: var(--coupon-txc);
  background-color: var(--coupon-bgc);
  background-image: var(--bgim, url()),
    linear-gradient(
      calc(var(--angle, 90deg) * var(--angle-reverse, 1)),
      hsl(
        var(--h) calc(var(--s) + var(--offset-s1, 0%))
          calc(var(--l) + var(--offset-l1, 0%))
      ),
      hsl(
        var(--h) calc(var(--s) + var(--offset-s2, 10%))
          calc(var(--l) + var(--offset-l2, 20%))
      )
    );
  box-shadow: var(--coupon-bdc, var(--coupon-bdc-default)) 0 0 0 1px inset;
  --spacing: 1.5em;
  --coupon-txsize: 2em;
  --coupon-bgc: var(--background-color, #fff);
  --coupon-txc: var(--color, rgba(0 0 0/75%));
  --coupon-bdc: hsl(
    0 0% calc((var(--lightness) - var(--threshold)) * -999999%) / 5%
  );
  --coupon-bdc-default: rgba(0 0 0/5%);
}
.coupon::after {
  content: "";
  display: block;
  height: 1px;
  background-color: var(--coupon-txc);
  order: 9;
  opacity: 0.1;
}
.coupon > .title {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--spacing);
  align-items: center;
  min-height: 2em;
}
.coupon > .func {
  order: 99;
}
.coupon .value {
  display: flex;
  align-items: flex-start;
  gap: 0.5em;
}
.coupon .num {
  display: block;
  font-size: var(--coupon-txsize);
  font-weight: 800;
  line-height: 1;
}
.coupon .unit {
  display: block;
  text-transform: uppercase;
  font-size: max(calc(var(--coupon-txsize) / 2), 12px);
  font-weight: 800;
}
.coupon .unit.credits {
  display: block;
  width: 1em;
  height: 1em;
  font-size: var(--coupon-txsize);
  overflow: hidden;
  align-self: center;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0OCA0OCI+PGxpbmVhckdyYWRpZW50IGlkPSJhIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAiIHkxPSIwIiB4Mj0iMTAwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI0YyQ0QyOCIvPjxzdG9wIG9mZnNldD0iLjIiIHN0b3AtY29sb3I9IiNGMkM5MjYiLz48c3RvcCBvZmZzZXQ9Ii41IiBzdG9wLWNvbG9yPSIjRUZBQTI2Ii8+PHN0b3Agb2Zmc2V0PSIuNyIgc3RvcC1jb2xvcj0iI0VDOEUyNiIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI0U0NTgyNyIvPjwvbGluZWFyR3JhZGllbnQ+PGNpcmNsZSBmaWxsPSJ1cmwoI2EpIiBjeD0iMjQiIGN5PSIyNCIgcj0iMjAiLz48Y2xpcFBhdGggaWQ9ImIiPjxjaXJjbGUgY3g9IjI0IiBjeT0iMjQiIHI9IjIwIi8+PC9jbGlwUGF0aD48ZyBjbGlwLXBhdGg9InVybCgjYikiPjxwYXRoIGZpbGwtb3BhY2l0eT0iLjEiIGZpbGw9IiMwNDAwMDAiIGQ9Ik0zNS4xIDkuN2MtLjEtLjItLjItLjUtLjMtLjctOS40IDQuMy0xOC4xIDguOC0xOC45IDE1LS41IDQuMyA2LjQgMi41IDYuNCA1LjItLjEgMy40LTMuMyA3LTcuNSAxMSAuNC4yLjguNSAxLjIuNyA2LjEtMy42IDExLjYtNyAxNC4zLTkuNCAzLjQtMy41IDQuMi03LjEtMS4zLTguMS03LjMtMS40LTMuNS02LjYgNi4xLTEzLjd6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTM0LjIgOC43Yy0uMS0uMy0uMS0uNS0uMi0uN2gtLjFjLTkuNCA0LjMtMTguMiA4LjgtMTkgMTUtLjUgNC4yIDYuNCAyLjQgNi40IDUuMi0uMSAzLjUtMy4zIDctNy42IDExLjEuNC4yLjguNSAxLjIuNyA2LjItMy42IDExLjYtNyAxNC40LTkuNSAzLjQtMy41IDQuMi03LjEtMS4zLTguMS03LjMtMS40LTMuNS02LjYgNi4yLTEzLjd6Ii8+PC9nPjxwYXRoIGZpbGw9IiNGMkNEMjgiIGQ9Ik0yNCA0QzEzIDQgNCAxMyA0IDI0czkgMjAgMjAgMjAgMjAtOSAyMC0yMFMzNSA0IDI0IDR6bTAgMzZjLTguOCAwLTE2LTcuMi0xNi0xNlMxNS4yIDggMjQgOHMxNiA3LjIgMTYgMTYtNy4yIDE2LTE2IDE2eiIvPjwvc3ZnPg==)
    no-repeat center/contain;
  color: transparent;
  border-radius: 100%;
}
.coupon .stat .claimed {
  opacity: 0.7;
  text-transform: uppercase;
}
.coupon .stat .expired {
  opacity: 0.7;
  text-transform: uppercase;
}
.coupon .stat .btw {
  background-color: var(--coupon-txc);
  color: var(--coupon-bgc);
  text-transform: uppercase;
}
.coupon .stat .btw > span {
  padding: 0 1em;
}
.coupon .func .expiry,
.coupon .func .limit,
.coupon .func .name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coupon .func .name {
  font-weight: 800;
  text-transform: uppercase;
}
.coupon .func .expiry,
.coupon .func .limit {
  opacity: 0.7;
}
.coupon.star_reward {
  --coupon-txc: #fff;
  --coupon-bgc: goldenrod;
  --h: 35;
  --s: 50%;
  --l1: 38%;
  --l2: 65%;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0OCA0OCI+PHBhdGggZD0iTTI0IDQgNi42OCAxNHYyMEwyNCA0NGwxNy4zMi0xMFYxNEwyNCA0em0xNC4yMSAyOC4yMUwyNCA0MC40MWwtMTQuMjEtOC4yVjE1Ljc5TDI0IDcuNTlsMTQuMjEgOC4yMXYxNi40MXpNMjQgMTAuMTVsLTExLjk5IDYuOTJ2MTMuODVMMjQgMzcuODVsMTEuOTktNi45MlYxNy4wOEwyNCAxMC4xNXptOC41MyAxMS40Ni0zLjIxIDQuMTguMTQgNS4yN2MuMDEuMjYtLjI1LjQ1LS41LjM2TDI0IDI5LjY1bC00Ljk2IDEuNzdjLS4yNS4wOS0uNS0uMS0uNS0uMzZsLjE0LTUuMjctMy4yMS00LjE4YS4zNjguMzY4IDAgMCAxIC4xOS0uNThsNS4wNS0xLjQ5IDIuOTgtNC4zNWMuMTUtLjIyLjQ3LS4yMi42MSAwbDIuOTggNC4zNSA1LjA1IDEuNDljLjI2LjA3LjM2LjM3LjIuNTh6IiBmaWxsPSJyZ2JhKDI1NSAyNTUgMjU1LzEwJSkiLz48L3N2Zz4=),
    linear-gradient(
      calc(135deg * var(--angle-reverse, 1)),
      hsl(var(--h) var(--s) var(--l1)),
      hsl(var(--h) var(--s) var(--l2))
    );
  background-position: var(--inline-end, right) center, center center;
  background-size: auto 166.667%, auto;
  background-repeat: no-repeat;
}
.coupon.star_reward .unit.credits {
  background-color: rgba(0 0 0/10%);
}
.coupon-s {
  display: inline-flex;
  vertical-align: top;
  align-items: center;
  height: calc(var(--coupon-txsize) * 2);
  padding: 0 var(--spacing);
  border-radius: calc(var(--coupon-txsize) / 3);
  color: var(--coupon-txc);
  background-color: var(--coupon-bgc);
  background-image: var(--bgim, url()),
    linear-gradient(
      calc(var(--angle, 90deg) * var(--angle-reverse, 1)),
      hsl(
        var(--h) calc(var(--s) + var(--offset-s1, 0%))
          calc(var(--l) + var(--offset-l1, 0%))
      ),
      hsl(
        var(--h) calc(var(--s) + var(--offset-s2, 10%))
          calc(var(--l) + var(--offset-l2, 20%))
      )
    );
  box-shadow: var(--coupon-bdc, var(--coupon-bdc-default)) 0 0 0 1px inset;
  --spacing: calc(var(--coupon-txsize) * 0.75);
  --coupon-txsize: 1.25em;
  --coupon-bgc: var(--background-color, #fff);
  --coupon-txc: var(--color, rgba(0 0 0/75%));
  --coupon-bdc: hsl(
    0 0% calc((var(--lightness) - var(--threshold)) * -999999%) / 5%
  );
  --coupon-bdc-default: rgba(0 0 0/10%);
}
.coupon-s[color="khaki"],
.coupon-s[color="thistle"] {
  --angle: -90deg;
  --offset-s1: 0%;
  --offset-s2: -10%;
  --offset-l1: -10%;
  --offset-l2: 10%;
}
.coupon-s .value {
  font-size: var(--coupon-txsize);
  font-weight: 800;
  line-height: 1;
  display: flex;
  align-items: center;
  gap: 0.5em;
}
.coupon-s .value .unit {
  font-size: max(0.75em, 12px);
  text-transform: uppercase;
  opacity: 0.7;
  align-self: flex-start;
}
.coupon-s .value .unit.credits {
  display: block;
  width: 1em;
  height: 1em;
  font-size: 1em;
  overflow: hidden;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0OCA0OCI+PGxpbmVhckdyYWRpZW50IGlkPSJhIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAiIHkxPSIwIiB4Mj0iMTAwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI0YyQ0QyOCIvPjxzdG9wIG9mZnNldD0iLjIiIHN0b3AtY29sb3I9IiNGMkM5MjYiLz48c3RvcCBvZmZzZXQ9Ii41IiBzdG9wLWNvbG9yPSIjRUZBQTI2Ii8+PHN0b3Agb2Zmc2V0PSIuNyIgc3RvcC1jb2xvcj0iI0VDOEUyNiIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI0U0NTgyNyIvPjwvbGluZWFyR3JhZGllbnQ+PGNpcmNsZSBmaWxsPSJ1cmwoI2EpIiBjeD0iMjQiIGN5PSIyNCIgcj0iMjAiLz48Y2xpcFBhdGggaWQ9ImIiPjxjaXJjbGUgY3g9IjI0IiBjeT0iMjQiIHI9IjIwIi8+PC9jbGlwUGF0aD48ZyBjbGlwLXBhdGg9InVybCgjYikiPjxwYXRoIGZpbGwtb3BhY2l0eT0iLjEiIGZpbGw9IiMwNDAwMDAiIGQ9Ik0zNS4xIDkuN2MtLjEtLjItLjItLjUtLjMtLjctOS40IDQuMy0xOC4xIDguOC0xOC45IDE1LS41IDQuMyA2LjQgMi41IDYuNCA1LjItLjEgMy40LTMuMyA3LTcuNSAxMSAuNC4yLjguNSAxLjIuNyA2LjEtMy42IDExLjYtNyAxNC4zLTkuNCAzLjQtMy41IDQuMi03LjEtMS4zLTguMS03LjMtMS40LTMuNS02LjYgNi4xLTEzLjd6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTM0LjIgOC43Yy0uMS0uMy0uMS0uNS0uMi0uN2gtLjFjLTkuNCA0LjMtMTguMiA4LjgtMTkgMTUtLjUgNC4yIDYuNCAyLjQgNi40IDUuMi0uMSAzLjUtMy4zIDctNy42IDExLjEuNC4yLjguNSAxLjIuNyA2LjItMy42IDExLjYtNyAxNC40LTkuNSAzLjQtMy41IDQuMi03LjEtMS4zLTguMS03LjMtMS40LTMuNS02LjYgNi4yLTEzLjd6Ii8+PC9nPjxwYXRoIGZpbGw9IiNGMkNEMjgiIGQ9Ik0yNCA0QzEzIDQgNCAxMyA0IDI0czkgMjAgMjAgMjAgMjAtOSAyMC0yMFMzNSA0IDI0IDR6bTAgMzZjLTguOCAwLTE2LTcuMi0xNi0xNlMxNS4yIDggMjQgOHMxNiA3LjIgMTYgMTYtNy4yIDE2LTE2IDE2eiIvPjwvc3ZnPg==);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  color: transparent;
  opacity: 1;
}
.coupon-s.unavailable,
.coupon.unavailable {
  --coupon-txc: var(--color, rgba(0 0 0/50%));
  --color-alpha: 0.75;
}
.coupon[coupon_code="SxT49pJNbPCUWROApCnrPqhWHwG3zBQYKpbpdA"] {
  --coupon-txc: #fff;
  --coupon-bgc: hotpink;
  background-image: linear-gradient(180deg, transparent, #ffa07a),
    url(https://seagm-media.seagmcdn.com/art/v5/star/star_intro_art2.png?x-oss-process=image/resize,h_360),
    linear-gradient(calc(-45deg * var(--angle-reverse, 1)), #ffa07a, #ff69b4);
  background-position: center bottom, var(--inline-end, right) top, center;
  background-size: 100% calc(100% - 5em), auto 120%, auto;
  background-repeat: no-repeat;
}