/* ----------------------------------------
  診断（SHINDAN）
---------------------------------------- */
.shindan__inner {
  margin-top: 88px;
}
@media (max-width: 1480px) {
  .shindan__inner {
    margin-top: 70px;
  }
}
@media (max-width: 736px) {
  .shindan__inner {
    margin-top: 64px;
  }
}
.shindan__top-lead {
  padding-top: 40px;
  margin-bottom: 24px;
  width: 424px;
  margin-inline: auto;
}
@media (max-width: 736px) {
  .shindan__top-lead {
    padding-top: calc(24 * var(--scale-unit));
    width: calc(320 * var(--scale-unit));
    margin-bottom: calc(16 * var(--scale-unit));
  }
}
.shindan__top {
  text-align: center;
}
.shindan__top-inner,
.shindan__question-inner,
.shindan__result-inner {
  margin: 0 auto;
  width: 500px;
  height: 1080px;
  background-image: url(../../images/shindan/shindan_top_edge.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #000;
}
@media (max-width: 736px) {
  .shindan__top-inner,
  .shindan__question-inner,
  .shindan__result-inner {
    width: 100%;
    height: auto;
    aspect-ratio: 375 / 873;
    background-image: url(../../images/shindan/shindan_top_edge_sp.png);
  }
  .shindan__question-inner {
    aspect-ratio: 375 / 833;
  }
}
.shindan__question-inner {
  position: relative;
  background-image: none;
}
.shindan__question-inner::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url(../../images/shindan/shindan_question_edge.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 10;
}
@media (max-width: 736px) {
  .shindan__question-inner::after {
    background-image: url(../../images/shindan/shindan_question_edge_sp.png);
  }
}
/* ::after より前面にコンテンツを表示するため */
.shindan__question-inner > .shindan__q-label {
  position: relative;
  z-index: 11;
}
.shindan__result-inner {
  height: 1100px;
  position: relative;
}
.shindan__result-character-4,
.shindan__result-character-6,
.shindan__result-character-10,
.shindan__result-character-11,
.shindan__result-character-12 {
  height: 1075px;
}
@media (max-width: 736px) {
  .shindan__result-inner {
    height: auto;
    aspect-ratio: 375 / 900;
  }
}
.shindan__title-top {
  width: 360px;
  margin-inline: auto;
}
@media (max-width: 736px) {
  .shindan__title-top {
    width: calc(280 * var(--scale-unit));
    margin-block: calc(16 * var(--scale-unit));
  }
}
.shindan__list {
  width: 380px;
  margin-top: 32px;
  margin-inline: auto;
}
@media (max-width: 736px) {
  .shindan__list {
    width: calc(310 * var(--scale-unit));
    margin-top: 0;
  }
}
.shindan__start-btn {
  width: 480px;
  margin-left: 20px;
  margin-top: 43px;
  display: block;
  transition: all 0.3s ease;
}
@media (min-width: 737px) {
  .shindan__start-btn:hover {
    opacity: 0.7!important;
  }
}
@media (max-width: 736px) {
  .shindan__start-btn {
    width: calc(360 * var(--scale-unit));
    margin-top: calc(24 * var(--scale-unit));
    margin-left: calc(15 * var(--scale-unit));
  }
}
.shindan__q-label {
  text-align: center;
  padding-top: 10px;
  font-size: 48px;
  margin-bottom: 72px;
  letter-spacing: 0.1em;
  color: #000;
}
@media (max-width: 736px) {
  .shindan__q-label {
    font-size: calc(32 * var(--scale-unit));
    padding-top: calc(8 * var(--scale-unit));
    margin-bottom: calc(48 * var(--scale-unit));
  }
}
.shindan__q-label-current {
  font-size: 64px;
}
@media (max-width: 736px) {
  .shindan__q-label-current {
    font-size: calc(50 * var(--scale-unit));
  }
}
.shindan__q-label-total {
  font-size: 48px;
}
@media (max-width: 736px) {
  .shindan__q-label-total {
    font-size: calc(36 * var(--scale-unit));
  }
}
.shindan__q-text {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 24px;
  margin-inline: auto;
  text-align: center;
  width: 450px;
}
@media (max-width: 736px) {
  .shindan__q-text {
    font-size: calc(22 * var(--scale-unit));
    margin-bottom: calc(16 * var(--scale-unit));
    width: 100%;
  }
}
.shindan__q-image-wrap {
  width: 460px;
  margin-inline: auto;
}
@media (max-width: 736px) {
  .shindan__q-image-wrap {
    width: calc(345 * var(--scale-unit));
  }
}
.shindan__choices {
  list-style: none;
}
.shindan__choice-item {
  width: 460px;
  margin-inline: auto;
}
@media (max-width: 736px) {
  .shindan__choice-item {
    width: calc(345 * var(--scale-unit));
  }
}
.shindan__choice-link {
  border-bottom: 1px solid #fff;
  padding-block: 30px;
  font-size: 20px;
  font-weight: 700;
  text-decoration: none;
  text-align: center;
  display: block;
  color: #fff;
  transition: all 0.3s ease;
}
/* 最初のアイテムのみ border-top を付与（重なりをなくすため） */
.shindan__choice-item:first-child .shindan__choice-link {
  border-top: 1px solid #fff;
}
@media (min-width: 737px) {
  .shindan__choice-link:hover {
    background-color: #23DCFF;
    color: #000;
    opacity: 1;
    border-color: #23DCFF;
  }
}
@media (max-width: 736px) {
  .shindan__choice-link {
    width: 100%;
    height: auto;
    padding-block: calc(20 * var(--scale-unit));
    font-size: calc(15 * var(--scale-unit));
  }
}
.shindan__choice-link.is-selected {
  color: var(--accent-color, #23dce1);
}
.shindan__nav {
  width: 380px;
  margin-inline: auto;
  margin-top: 40px;
  font-size: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (max-width: 736px) {
  .shindan__nav {
    width: 100%;
    margin-top: calc(32 * var(--scale-unit));
    font-size: calc(32 * var(--scale-unit));
  }
}
.shindan__nav-link {
  color: #fff;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.3s ease;
}
@media (max-width: 736px) {
  .shindan__nav-link {
    gap: 0;
  }
}
@media (min-width: 737px) {
  .shindan__nav-link:hover {
    opacity: 1;
    color: var(--accent-color, #23dce1);
  }
}
.shindan__nav-arrow {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
}
@media (max-width: 736px) {
  .shindan__nav-arrow {
    width: calc(20 * var(--scale-unit));
    height: calc(20 * var(--scale-unit));
  }
}
.shindan__nav-arrow--left {
  transform: rotate(-135deg);
}
.shindan__nav-arrow--right {
  transform: rotate(45deg);
}
.shindan__result {
  text-align: center;
}
.shindan__result-character-1 {
  background-image: url(../../images/shindan/shindan_result-edge-1.png);
}
.shindan__result-character-2 {
  background-image: url(../../images/shindan/shindan_result-edge-2.png);
}
.shindan__result-character-3 {
  background-image: url(../../images/shindan/shindan_result-edge-3.png);
}
.shindan__result-character-4 {
  background-image: url(../../images/shindan/shindan_result-edge-4.png);
}
.shindan__result-character-5 {
  background-image: url(../../images/shindan/shindan_result-edge-5.png);
}
.shindan__result-character-6 {
  background-image: url(../../images/shindan/shindan_result-edge-6.png);
}
.shindan__result-character-7 {
  background-image: url(../../images/shindan/shindan_result-edge-7.png);
}
.shindan__result-character-8 {
  background-image: url(../../images/shindan/shindan_result-edge-8.png);
}
.shindan__result-character-9 {
  background-image: url(../../images/shindan/shindan_result-edge-9.png);
}
.shindan__result-character-10 {
  background-image: url(../../images/shindan/shindan_result-edge-10.png);
}
.shindan__result-character-11 {
  background-image: url(../../images/shindan/shindan_result-edge-11.png);
}
.shindan__result-character-12 {
  background-image: url(../../images/shindan/shindan_result-edge-12.png);
}
@media (max-width: 736px) {
  .shindan__result-character-1 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-1.png);
  }
  .shindan__result-character-2 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-2.png);
  }
  .shindan__result-character-3 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-3.png);
  }
  .shindan__result-character-4 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-4.png);
  }
  .shindan__result-character-5 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-5.png);
  }
  .shindan__result-character-6 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-6.png);
  }
  .shindan__result-character-7 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-7.png);
  }
  .shindan__result-character-8 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-8.png);
  }
  .shindan__result-character-9 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-9.png);
  }
  .shindan__result-character-10 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-10.png);
  }
  .shindan__result-character-11 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-11.png);
  }
  .shindan__result-character-12 {
    background-image: url(../../images/shindan/shindan_result-edge-sp-12.png);
  }
}
.shindan__result-name {
  font-size: 44px;
  font-weight: 400;
  line-height: 1.2;
  padding-top: 24px;
}
.shindan__result-name-text {
  font-size: 48px;
  display: inline-block;
  padding-inline: 12px;
  padding-bottom: 6px;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-size: 100%;
}
@media (max-width: 736px) {
  .shindan__result-name {
    font-size: calc(36 * var(--scale-unit));
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    line-height: 1.3;
    padding-top: calc(24 * var(--scale-unit));
  }
  .shindan__result-name-text {
    font-size: calc(36 * var(--scale-unit));
    padding-bottom: 4px;
    padding-inline: calc(12 * var(--scale-unit));
  }
}
.shindan__result-name-suffix {
  margin-left: -12px;
}
@media (max-width: 736px) {
  .shindan__result-name-suffix {
    margin-left: calc(-8 * var(--scale-unit));
  }
}
.shindan__result-character-1 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-1.png);
}
.shindan__result-character-2 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-2.png);
}
.shindan__result-character-3 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-3.png);
}
.shindan__result-character-4 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-4.png);
}
.shindan__result-character-5 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-5.png);
}
.shindan__result-character-6 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-6.png);
}
.shindan__result-character-7 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-7.png);
}
.shindan__result-character-8 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-8.png);
}
.shindan__result-character-9 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-9.png);
}
.shindan__result-character-10 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-10.png);
}
.shindan__result-character-11 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-11.png);
}
.shindan__result-character-12 .shindan__result-name-text {
  background-image: url(../../images/shindan/shindan_name-bar-12.png);
}
.shindan__result-image-wrap {
  margin: 16px auto;
  max-width: 420px;
}
@media (max-width: 736px) {
  .shindan__result-image-wrap {
    margin: calc(12 * var(--scale-unit)) auto calc(16 * var(--scale-unit));
    width: calc(315 * var(--scale-unit));
    max-width: none;
  }
}
.shindan__result-description {
  max-width: 410px;
  margin: 0 auto 16px;
  font-size: 17px;
  line-height: 1.8;
  text-align: left;
}
@media (max-width: 736px) {
  .shindan__result-description {
    width: calc(330 * var(--scale-unit));
    max-width: none;
    font-size: calc(16 * var(--scale-unit));
    margin-bottom: calc(20 * var(--scale-unit));
  }
}
.shindan__result-actions {
  max-width: 640px;
  margin-inline: auto;
}
.shindan__result-sns.footer__sns-wrap {
  display: flex;
  justify-content: center;
}
@media (max-width: 736px) {
  .shindan__result-sns.footer__sns-wrap {
    margin-block: 0;
  }
}
.shindan__retry {
  width: 480px;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(calc(-50% + 10px));
}
@media (max-width: 736px) {
  .shindan__retry {
    width: calc(360 * var(--scale-unit));
    margin-inline: auto;
    transform: translateX(calc(-50% + calc(7 * var(--scale-unit))));
  }
}

/* ----------------------------------------
  共通キーフレーム
---------------------------------------- */
@keyframes shindanFadeSlideIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes shindanFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ----------------------------------------
  トップページ
---------------------------------------- */

/* リードテキスト */
.shindan__top .shindan__top-lead {
  opacity: 0;
  animation: shindanFadeSlideIn 0.5s ease-out 0.1s forwards;
}

/* スマホフレーム登場（フレーム自体はグリッチしない） */
.shindan__top .shindan__top-inner {
  opacity: 0;
  animation: shindanPhoneEnter 0.6s ease-out 0.2s forwards;
}

@keyframes shindanPhoneEnter {
  from {
    opacity: 0;
    transform: scale(0.95);
    filter: brightness(0.5);
  }
  to {
    opacity: 1;
    transform: scale(1);
    filter: brightness(1);
  }
}

/* コンテンツ順次フェードイン */
#shindan-anime {
  position: relative;
}

#shindan-anime .shindan__title-top,
#shindan-anime .shindan__list,
#shindan-anime .shindan__start-btn {
  opacity: 0;
}

#shindan-anime .shindan__title-top {
  animation: shindanFadeSlideIn 0.5s ease-out 0.8s forwards;
}

#shindan-anime .shindan__list {
  display: block;
  animation: shindanFadeSlideIn 0.5s ease-out 1.1s forwards;
}

#shindan-anime .shindan__start-btn {
  display: block;
  animation: shindanFadeSlideIn 0.5s ease-out 1.4s forwards;
}

/* グリッチ: 全コンテンツ表示後に内部だけ発動（フレームは静止） */
#shindan-anime.is-glitching {
  animation: shindanGlitch 0.4s step-start;
}

@keyframes shindanGlitch {
  0% {
    transform: none;
    filter: none;
  }
  20% {
    transform: translate(-8px, 0) skewX(-1deg);
    filter: hue-rotate(90deg) brightness(1.3);
  }
  40% {
    transform: translate(10px, 0) skewX(1deg);
    filter: hue-rotate(-60deg) brightness(1.1);
  }
  60% {
    transform: translate(-5px, 0) skewX(-0.5deg);
    filter: hue-rotate(30deg);
  }
  80% {
    transform: translate(3px, 0);
    filter: none;
  }
  100% {
    transform: none;
    filter: none;
  }
}

/* スキャンライン: グリッチと同期 */
#shindan-anime.is-glitching::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 10;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(35, 220, 225, 0.1) 2px,
    rgba(35, 220, 225, 0.1) 4px
  );
  animation: shindanScanline 0.4s ease-out;
}

@keyframes shindanScanline {
  0%   { opacity: 1; }
  60%  { opacity: 0.5; }
  100% { opacity: 0; }
}

/* ----------------------------------------
  設問ページ
---------------------------------------- */
.shindan__question .shindan__title-question {
  opacity: 0;
  animation: shindanFadeIn 0.4s ease-out forwards;
}

.shindan__question .shindan__q-label {
  opacity: 0;
  animation: shindanFadeSlideIn 0.4s ease-out 0.1s forwards;
}

.shindan__question .shindan__q-text {
  opacity: 0;
  animation: shindanFadeSlideIn 0.4s ease-out 0.2s forwards;
}

.shindan__question .shindan__q-image-wrap {
  opacity: 0;
  animation: shindanFadeIn 0.4s ease-out 0.3s forwards;
}

.shindan__question .shindan__choice-item {
  opacity: 0;
  animation: shindanFadeSlideIn 0.4s ease-out forwards;
}
.shindan__question .shindan__choice-item:nth-child(1) { animation-delay: 0.35s; }
.shindan__question .shindan__choice-item:nth-child(2) { animation-delay: 0.45s; }
.shindan__question .shindan__choice-item:nth-child(3) { animation-delay: 0.55s; }
.shindan__question .shindan__choice-item:nth-child(4) { animation-delay: 0.65s; }
.shindan__question .shindan__choice-item:nth-child(5) { animation-delay: 0.75s; }
.shindan__question .shindan__nav {
  opacity: 0;
  animation: shindanFadeIn 0.3s ease-out 0.7s forwards;
}

/* ----------------------------------------
  リザルトページ
---------------------------------------- */
.shindan__result .shindan__result-name {
  opacity: 0;
  animation: shindanResultName 0.6s ease-out 0.2s forwards;
}

@keyframes shindanResultName {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.shindan__result .shindan__result-image-wrap {
  opacity: 0;
  animation: shindanResultImage 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) 0.5s forwards;
}

@keyframes shindanResultImage {
  from {
    opacity: 0;
    transform: scale(0.8);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* ----------------------------------------
  リザルトページ グリッチアニメーション
  （ページ表示直後に発動し、終了後コンテンツを表示）
---------------------------------------- */

/* グリッチキーフレーム（トップの0.4sより長い1.5s想定） */
@keyframes shindanResultGlitch {
  0%   { transform: none; filter: none; }
  7%   { transform: translate(-12px, 2px) skewX(-2deg); filter: hue-rotate(90deg) brightness(1.5); }
  14%  { transform: translate(16px, -1px) skewX(1.5deg); filter: hue-rotate(-60deg) brightness(1.3); }
  21%  { transform: translate(-6px, 3px) skewX(-1deg); filter: hue-rotate(30deg) brightness(0.8); }
  28%  { transform: translate(10px, -2px); filter: hue-rotate(180deg) brightness(1.4); }
  35%  { transform: translate(-14px, 1px) skewX(-2deg); filter: hue-rotate(-90deg) brightness(1.2); }
  42%  { transform: translate(8px, 0); filter: hue-rotate(60deg) brightness(1.1); }
  49%  { transform: translate(-5px, 2px) skewX(0.5deg); filter: hue-rotate(45deg); }
  56%  { transform: translate(6px, -1px); filter: hue-rotate(-30deg) brightness(1.2); }
  63%  { transform: translate(-4px, 0) skewX(-0.5deg); filter: hue-rotate(20deg); }
  70%  { transform: translate(3px, 1px); filter: none; }
  77%  { transform: translate(-3px, 0); filter: hue-rotate(10deg) brightness(1.1); }
  84%  { transform: translate(2px, 0); filter: none; }
  91%  { transform: translate(-1px, 0); filter: hue-rotate(5deg); }
  100% { transform: none; filter: none; }
}

/* グリッチ発動クラス */
#shindan-result-anime.is-glitching {
  animation: shindanResultGlitch 1.5s step-start;
}

/* スキャンライン（グリッチと同期） */
#shindan-result-anime.is-glitching::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 10;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(35, 220, 225, 0.12) 2px,
    rgba(35, 220, 225, 0.12) 4px
  );
  animation: shindanResultScanline 1.5s ease-out;
}

@keyframes shindanResultScanline {
  0%   { opacity: 1; }
  70%  { opacity: 0.6; }
  100% { opacity: 0; }
}

/* ----------------------------------------
  description 帯アニメーション
---------------------------------------- */

/* キャラクター別 帯カラー */
.shindan__result-character-1  { --shindan-band-color: #23DCFF; }
.shindan__result-character-2  { --shindan-band-color: #00D264; }
.shindan__result-character-3  { --shindan-band-color: #9655D2; }
.shindan__result-character-4  { --shindan-band-color: #FF961E; }
.shindan__result-character-5  { --shindan-band-color: #FF8CAA; }
.shindan__result-character-6  { --shindan-band-color: #FAEB00; }
.shindan__result-character-7  { --shindan-band-color: #F050B4; }
.shindan__result-character-8  { --shindan-band-color: #A05A14; }
.shindan__result-character-9  { --shindan-band-color: #FA8CFF; }
.shindan__result-character-10 { --shindan-band-color: #E1E182; }
.shindan__result-character-11 { --shindan-band-color: #96DC50; }
.shindan__result-character-12 { --shindan-band-color: #3CD2C8; }

@keyframes shindanLineBandReveal {
  from { clip-path: inset(0 100% 0 0); }
  to   { clip-path: inset(0 0% 0 0); }
}

.shindan__desc-line {
  display: inline-block;
  background-color: var(--shindan-band-color, #23DCFF);
  color: #000;
  padding: 0 4px;
  clip-path: inset(0 100% 0 0);
  animation: shindanLineBandReveal 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  margin-bottom: .2em;
}

/* 各行の表示タイミング（グリッチ1.5s + 余白0.9s から0.25s 間隔）  */
/* ※ JS 側でも animation-delay が上書きされる（BASE_DELAY=2.4） */
.shindan__result .shindan__desc-line:nth-child(1) { animation-delay: 2.4s; }
.shindan__result .shindan__desc-line:nth-child(2) { animation-delay: 2.65s; }
.shindan__result .shindan__desc-line:nth-child(3) { animation-delay: 2.9s; }
.shindan__result .shindan__desc-line:nth-child(4) { animation-delay: 3.15s; }
.shindan__result .shindan__desc-line:nth-child(5) { animation-delay: 3.4s; }

.shindan__result .shindan__result-actions {
  opacity: 0;
  animation: shindanFadeSlideIn 0.5s ease-out 3.2s forwards;
}

/* ----------------------------------------
  診断中ローディング画面
---------------------------------------- */

/* 2-1: オーバーレイ基本レイアウト */
.shindan__loading {
  position: fixed; /* ビューポート全体をカバーして中央配置 */
  inset: 0;
  z-index: 1000001; /* .header(1000000)より上、.drawer(9999999)より下 */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #000;
}

/* 3-1: エッジフレーム基本レイアウト（ビューポート中央・スマホフレームと同サイズ） */
.shindan__loading-edge {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 500px;
  height: 1100px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 1000002; /* .shindan__loading(1000001)より上 */
}

/* 3-2: SP レスポンシブ対応（.shindan__result-inner に合わせる） */
@media (max-width: 736px) {
  .shindan__loading-edge {
    top: 0;
    left: 0;
    transform: none;
    width: 100%;
    height: auto;
    aspect-ratio: 375 / 900;
  }
}

/* 3-3: キャラ4・6・10・11・12 は高さ 1075px */
.shindan__result-character-4  .shindan__loading-edge,
.shindan__result-character-6  .shindan__loading-edge,
.shindan__result-character-10 .shindan__loading-edge,
.shindan__result-character-11 .shindan__loading-edge,
.shindan__result-character-12 .shindan__loading-edge {
  height: 1075px;
}
@media (max-width: 736px) {
  .shindan__result-character-4  .shindan__loading-edge,
  .shindan__result-character-6  .shindan__loading-edge,
  .shindan__result-character-10 .shindan__loading-edge,
  .shindan__result-character-11 .shindan__loading-edge,
  .shindan__result-character-12 .shindan__loading-edge {
    height: auto;
  }
}

/* 3-4: PC 用 12キャラ分エッジ画像 */
.shindan__result-character-1  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-1.png); }
.shindan__result-character-2  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-2.png); }
.shindan__result-character-3  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-3.png); }
.shindan__result-character-4  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-4.png); }
.shindan__result-character-5  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-5.png); }
.shindan__result-character-6  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-6.png); }
.shindan__result-character-7  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-7.png); }
.shindan__result-character-8  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-8.png); }
.shindan__result-character-9  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-9.png); }
.shindan__result-character-10 .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-10.png); }
.shindan__result-character-11 .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-11.png); }
.shindan__result-character-12 .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-12.png); }

/* 3-5: SP 用 12キャラ分エッジ画像 */
@media (max-width: 736px) {
  .shindan__result-character-1  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-1.png); }
  .shindan__result-character-2  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-2.png); }
  .shindan__result-character-3  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-3.png); }
  .shindan__result-character-4  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-4.png); }
  .shindan__result-character-5  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-5.png); }
  .shindan__result-character-6  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-6.png); }
  .shindan__result-character-7  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-7.png); }
  .shindan__result-character-8  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-8.png); }
  .shindan__result-character-9  .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-9.png); }
  .shindan__result-character-10 .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-10.png); }
  .shindan__result-character-11 .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-11.png); }
  .shindan__result-character-12 .shindan__loading-edge { background-image: url(../../images/shindan/shindan_result-edge-sp-12.png); }
}

/* 2-2: キャラ集合画像 */
.shindan__loading-img-wrap {
  position: relative;
  width: 380px;
  overflow: hidden; /* グリッチ translate が外にはみ出してページが揺れるのを防ぐ */
}
@media (max-width: 736px) {
  .shindan__loading-img-wrap {
    width: calc(310 * var(--scale-unit));
  }
}

.shindan__loading-img {
  display: block;
  width: 100%;
  height: auto;
}

/* 2-3: 「診断中...」テキストを画像の上に重ねる */
.shindan__loading-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  font-size: 64px;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  text-shadow:
    0 0 8px rgba(255, 255, 255, 0.8),
    1px 1px 0 #000,
    -1px -1px 0 #000,
    2px 2px 6px #000;
}
@media (max-width: 736px) {
  .shindan__loading-text {
    font-size: calc(48 * var(--scale-unit));
  }
}

/* 2-4: 各文字フェードインアニメーション */
@keyframes shindanCharIn {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

.shindan__loading-text span {
  display: inline-block;
  opacity: 0;
  animation: shindanCharIn 0.2s ease-out forwards;
}

/* 1文字あたり 250ms 間隔 */
.shindan__loading-text span:nth-child(1) { animation-delay: 0ms; }
.shindan__loading-text span:nth-child(2) { animation-delay: 250ms; }
.shindan__loading-text span:nth-child(3) { animation-delay: 500ms; }
.shindan__loading-text span:nth-child(4) { animation-delay: 750ms; }
.shindan__loading-text span:nth-child(5) { animation-delay: 1000ms; }
.shindan__loading-text span:nth-child(6) { animation-delay: 1250ms; }

/* 2-5: 画像にグリッチエフェクト（shindanResultGlitch を弱めた専用キーフレーム） */
@keyframes shindanLoadingGlitch {
  0%   { transform: none; filter: none; }
  7%   { transform: translate(-2px, 0); filter: hue-rotate(60deg) brightness(1.2); }
  14%  { transform: translate(2px, 0); filter: hue-rotate(-40deg) brightness(1.15); }
  21%  { transform: translate(-1px, 0); filter: hue-rotate(20deg) brightness(0.9); }
  28%  { transform: translate(2px, 0); filter: hue-rotate(90deg) brightness(1.2); }
  35%  { transform: translate(-2px, 0); filter: hue-rotate(-50deg) brightness(1.1); }
  42%  { transform: translate(1px, 0); filter: hue-rotate(30deg) brightness(1.05); }
  49%  { transform: translate(-1px, 0); filter: hue-rotate(20deg); }
  56%  { transform: translate(1px, 0); filter: hue-rotate(-15deg) brightness(1.1); }
  63%  { transform: translate(-1px, 0); filter: hue-rotate(10deg); }
  70%  { transform: translate(1px, 0); filter: none; }
  77%  { transform: translate(-1px, 0); filter: hue-rotate(5deg); }
  84%  { transform: none; filter: none; }
  91%  { transform: none; filter: none; }
  100% { transform: none; filter: none; }
}

.shindan__loading-img {
  animation: shindanLoadingGlitch 1.5s step-start;
}

/* 4-1: エッジフレームのカラーグリッチ（hue-rotate のみ・transform なし） */
@keyframes shindanLoadingEdgeGlitch {
  0%   { filter: none; }
  7%   { filter: hue-rotate(60deg) brightness(1.2); }
  14%  { filter: hue-rotate(-40deg) brightness(1.15); }
  21%  { filter: hue-rotate(20deg) brightness(0.9); }
  28%  { filter: hue-rotate(90deg) brightness(1.2); }
  35%  { filter: hue-rotate(-50deg) brightness(1.1); }
  42%  { filter: hue-rotate(30deg) brightness(1.05); }
  49%  { filter: hue-rotate(20deg); }
  56%  { filter: hue-rotate(-15deg) brightness(1.1); }
  63%  { filter: hue-rotate(10deg); }
  70%  { filter: none; }
  77%  { filter: hue-rotate(5deg); }
  84%  { filter: none; }
  91%  { filter: none; }
  100% { filter: none; }
}

/* 4-2: エッジフレームにアニメーションを適用 */
.shindan__loading-edge {
  animation: shindanLoadingEdgeGlitch 1.5s step-start;
}

/* 2-6: フェードアウト（JS が .is-hiding を付与） */
.shindan__loading.is-hiding {
  opacity: 0;
  transition: opacity 0.5s ease-out;
  pointer-events: none;
}

/* 2-7: JS が .is-ready を付与するまで結果コンテンツを隠しアニメーションも一時停止する */
/* animation-play-state: paused により delay のカウントも止まり、
   is-ready 付与の瞬間から正しいタイミングでアニメーションが再生される */
#shindan-result-anime:not(.is-ready) .shindan__result-name,
#shindan-result-anime:not(.is-ready) .shindan__result-image-wrap,
#shindan-result-anime:not(.is-ready) .shindan__result-description,
#shindan-result-anime:not(.is-ready) .shindan__result-actions,
#shindan-result-anime:not(.is-ready) .shindan__retry,
#shindan-result-anime:not(.is-ready) .shindan__desc-line {
  visibility: hidden;
  animation-play-state: paused;
}

/* ----------------------------------------
  アクセシビリティ: モーション軽減
---------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .shindan__top .shindan__top-lead,
  .shindan__top .shindan__top-inner,
  #shindan-anime,
  #shindan-anime::after,
  #shindan-anime .shindan__title-top,
  #shindan-anime .shindan__list,
  #shindan-anime .shindan__start-btn,
  .shindan__question .shindan__title-question,
  .shindan__question .shindan__q-label,
  .shindan__question .shindan__q-text,
  .shindan__question .shindan__q-image-wrap,
  .shindan__question .shindan__choice-item,
  .shindan__question .shindan__nav,
  .shindan__result .shindan__result-name,
  .shindan__result .shindan__result-image-wrap,
  .shindan__result .shindan__result-description,
  .shindan__result .shindan__result-actions,
  #shindan-result-anime,
  #shindan-result-anime::before {
    animation: none !important;
    opacity: 1 !important;
  }
  .shindan__desc-line {
    animation: none !important;
    clip-path: none !important;
  }
  /* 2-8: ローディング関連のモーション軽減 */
  .shindan__loading,
  .shindan__loading-img {
    animation: none !important;
    opacity: 1 !important;
  }
  .shindan__loading-text span {
    animation: none !important;
    opacity: 1 !important;
  }
  /* 4-3: エッジグリッチのモーション軽減 */
  .shindan__loading-edge {
    animation: none !important;
  }
}