.results__rate {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 0 16px 48px;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-image: linear-gradient(90deg, #000 0%, #8E6944 25%, #EED581 50%, #8E6944 75%, #000 100%) 1;
  text-align: center;
}
@media (min-width: 961px) {
  .results__rate {
    padding-bottom: 64px;
  }
}

.results__share {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  margin-top: 40px;
}

.results__shareTitle {
  margin: 0;
  font-size: 0;
}
.results__shareTitle img {
  width: auto;
  height: 32px;
}

.results__shareBtn {
  display: block;
  width: 100%;
  max-width: 399px;
  font-size: 0;
}
.results__shareBtn img {
  width: 100%;
  height: auto;
}

.results__downloadBtn {
  display: block;
  width: 100%;
  max-width: 388px;
  margin: 56px auto 0;
  font-size: 0;
}
.results__downloadBtn img {
  width: 100%;
  height: auto;
}

.results__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 138px;
  padding-top: 23px;
  background: linear-gradient(90deg, rgba(23, 9, 9, 0.95) 0%, rgba(19, 19, 19, 0.95) 20%, rgba(54, 54, 47, 0.95) 50%, rgba(19, 19, 19, 0.95) 80%, rgba(23, 9, 9, 0.95) 100%);
}

.results__headTitle {
  margin: 0;
  font-size: 0;
}
.results__headTitle img {
  width: 349px;
  height: auto;
}

.results__rate--v2 {
  padding: 0 16px;
}

.results__actions {
  position: relative;
  isolation: isolate;
  display: flow-root;
  margin: 0 -16px;
  padding: 0 16px 48px;
  background: linear-gradient(180deg, #27292b 20%, #000 100%);
}
@media (min-width: 961px) {
  .results__actions {
    padding-bottom: 64px;
  }
}

.results__actionsBg {
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.5;
  overflow: hidden;
  font-size: 0;
}
.results__actionsBg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.results__rateStage {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 -16px;
  padding: 5px 0 18px;
  background: #480705;
}
@media (min-width: 961px) {
  .results__rateStage {
    --u: min(1px, 100vw / 1280);
    display: block;
    height: calc(678 * var(--u));
    padding: 0;
  }
}

.results__rateBg {
  position: absolute;
  inset: 0;
  z-index: -1;
  font-size: 0;
  pointer-events: none;
}
.results__rateBg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
}

.results__rateSparkles {
  --ku: min(1px, 100vw / 390);
  position: absolute;
  inset: 0;
  pointer-events: none;
}
@media (min-width: 961px) {
  .results__rateSparkles {
    --ku: var(--u);
  }
}
.results__rateSparkles img {
  position: absolute;
  top: calc((var(--y) - var(--s) / 2) * var(--ku));
  left: calc(50% + (var(--x) - var(--s) / 2) * var(--ku));
  width: calc(var(--s) * var(--ku));
  height: calc(var(--s) * var(--ku));
  max-width: none;
  mix-blend-mode: screen;
  transform: rotate(45deg);
}

.results__rateSparkles--pc {
  display: none;
}
@media (min-width: 961px) {
  .results__rateSparkles--pc {
    display: block;
  }
}

@media (min-width: 961px) {
  .results__rateSparkles--sp {
    display: none;
  }
}

.results__ratePlayer {
  position: relative;
  width: min(337.4px, 100% - 32px);
  aspect-ratio: 735/830;
  margin-bottom: 24.6px;
  font-size: 0;
}
.results__ratePlayer img {
  position: absolute;
  top: -29.156626506%;
  left: -39.7278911565%;
  width: 179.1836734694%;
  max-width: none;
  height: auto;
}
@media (min-width: 961px) {
  .results__ratePlayer {
    position: absolute;
    top: calc(-10.1 * var(--u));
    left: calc(50% - 554.1 * var(--u));
    width: calc(529.2 * var(--u));
    margin: 0;
  }
}

.results__rateResult {
  --r: 0.75px;
  --rv: min(0.7px, (100vw - 40px) / 483);
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24.4px;
}
@media (min-width: 961px) {
  .results__rateResult {
    --r: var(--u);
    --rv: var(--u);
    position: absolute;
    top: calc(95 * var(--u));
    left: calc(50% + 222.5 * var(--u));
    gap: calc(30 * var(--u));
    transform: translateX(-50%);
  }
}

.results__rateScoreText {
  display: flex;
  align-items: center;
  gap: calc(17.3 * var(--r));
  margin: 0;
  color: #fff;
  font-family: "Kazesawa", sans-serif;
  font-size: calc(32.4 * var(--r));
  font-weight: 700;
  line-height: 2;
  letter-spacing: 0.1em;
  white-space: nowrap;
  filter: drop-shadow(3px 3px 0.1px #000);
  -webkit-text-stroke-width: 5px;
  -webkit-text-stroke-color: #000;
  paint-order: stroke fill;
}

.results__rateScoreCount {
  display: flex;
  align-items: center;
  gap: calc(7.2 * var(--r));
  paint-order: stroke fill;
}

.results__rateScoreNum {
  display: flex;
  gap: calc(2.7 * var(--r));
  font-family: "poster-gothic-atf", sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: calc(43.2 * var(--r));
  line-height: 1;
  letter-spacing: 0;
}

.results__rateScoreCorrect {
  color: #FAE452;
}

.results__rateValue {
  display: flex;
  align-items: flex-end;
  margin: 0;
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  line-height: 1;
  font-feature-settings: "palt" 1;
  white-space: nowrap;
  filter: drop-shadow(calc(10 * var(--rv)) calc(10 * var(--rv)) calc(6.757 * var(--rv)) #000) drop-shadow(0 0 calc(30 * var(--rv)) rgba(234, 192, 91, 0.3));
}

.results__rateValueNum {
  background: linear-gradient(0deg, #cea33f 0%, #ffa 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: calc(315.33 * var(--rv));
  text-box: trim-both cap alphabetic;
  padding: 0.05em 0;
  margin: -0.05em 0;
  --outline: color-mix(in srgb, #000 20%, #cea33f);
  --w: 2.5px;
  filter: drop-shadow(var(--w) 0 0 var(--outline)) drop-shadow(calc(var(--w) * -1) 0 0 var(--outline)) drop-shadow(0 var(--w) 0 var(--outline)) drop-shadow(0 calc(var(--w) * -1) 0 var(--outline));
}

.results__rateValueUnit {
  color: #fff;
  font-size: calc(180.19 * var(--rv));
  letter-spacing: -0.02em;
  margin-left: calc(8 * var(--rv));
  text-box: trim-both cap alphabetic;
}

.results__rateTitle {
  position: relative;
  flex-shrink: 0;
  width: min(395.5px, 100%);
  margin: 18.6px 0 0;
  font-size: 0;
}
.results__rateTitle img {
  width: 100%;
  height: auto;
}
@media (min-width: 961px) {
  .results__rateTitle {
    position: absolute;
    top: calc(418.4 * var(--u));
    left: calc(50% - 71 * var(--u));
    width: calc(684 * var(--u));
    max-width: none;
    margin: 0;
  }
}

.results__cta {
  position: relative;
  isolation: isolate;
  padding: 16px;
  background: linear-gradient(180deg, #27292b 20%, #000 100%);
  text-align: center;
}

.results__ctaText {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: fit-content;
  margin: 0 auto;
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 2;
  text-shadow: 2px 2px 0 #000;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #000;
  paint-order: stroke fill;
}
@media (min-width: 961px) {
  .results__ctaText {
    flex-direction: row;
    align-items: center;
    gap: 5px;
    font-size: 20px;
  }
}

.results__ctaLine {
  display: flex;
  align-items: center;
  gap: 5px;
}
.results__ctaLine:first-child {
  margin-bottom: -6px;
}
.results__ctaLine:last-child {
  gap: 8px;
}
@media (min-width: 961px) {
  .results__ctaLine:first-child {
    margin-bottom: 0;
  }
  .results__ctaLine:last-child {
    gap: 5px;
  }
}

.results__ctaGold,
.results__ctaDate {
  color: #FAE452;
  -webkit-text-stroke: 2px #000;
  paint-order: stroke fill;
  text-shadow: none;
}

.results__ctaGold {
  font-family: "Kazesawa", sans-serif;
  filter: drop-shadow(1px 1px 0 #000);
}

.results__ctaDate {
  filter: drop-shadow(2px 2px 0 #000);
  font-family: "poster-gothic-atf", sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1;
}
.results__ctaDate small {
  display: none;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 10px;
}
@media (min-width: 961px) {
  .results__ctaDate small {
    display: inline;
  }
}

.results__links {
  background: #fff url("../images/results/links_pattern.jpg") left top/720px repeat;
}

.results__guide {
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 16px 42px;
}
@media (min-width: 961px) {
  .results__guide {
    padding: 40px 0 42px;
  }
}

.results__guideBubbles {
  display: flex;
  justify-content: center;
  gap: 8px;
}
@media (min-width: 961px) {
  .results__guideBubbles {
    gap: 54px;
  }
}

.results__guideBubble {
  position: relative;
  width: 100%;
  max-width: 294px;
  margin: 0;
}
@media (min-width: 961px) {
  .results__guideBubble {
    width: 445px;
    max-width: none;
  }
}
.results__guideBubble img {
  display: block;
  width: 100%;
  height: auto;
}

.results__guideBtn {
  display: block;
  max-width: 354px;
  margin: 14px auto 0;
  padding: 2px;
  border-radius: 10px;
  background: #000;
  text-decoration: none;
  transition: opacity 0.3s;
}
.results__guideBtn:hover {
  opacity: 0.8;
}
@media (min-width: 961px) {
  .results__guideBtn {
    max-width: none;
    margin-top: 18px;
  }
}

.results__guideBtnInner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0;
  height: 80px;
  border: 2px solid transparent;
  border-radius: 8px;
  background: linear-gradient(180deg, #323232 20%, #000 100%) padding-box, linear-gradient(180deg, #e4c672 0%, #ae7c1c 50%, #e4c672 100%) border-box;
  box-shadow: inset 0 0 0 2px #000;
  color: #fff;
  font-family: "Kazesawa", sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 130%; /* 22px */
  text-shadow: 2px 2px 0 #000;
}
@media (min-width: 961px) {
  .results__guideBtnInner {
    flex-direction: row;
    gap: 4px;
    height: 110px;
    font-size: 28px;
    line-height: 2;
  }
}

.results__guideBtnGold {
  color: #FAE452;
  -webkit-text-stroke: 2px #000;
  paint-order: stroke fill;
  text-shadow: none;
  filter: drop-shadow(2px 2px 0 #000);
}