/* =========================================================================
   裏タイプ診断 — ダーク・占いテーマ
   style.css の上に重ねて読み込み、body.ura-page スコープで
   カラー変数を上書きして全体をダーク化する。
   ========================================================================= */
body.ura-page{
  /* --- ダーク・神秘パレット（黒紺 × 金 × 紫）--- */
  --c-bg:        #0b0d1a;
  --c-bg-2:      #141733;
  --c-surface:   #161a36;
  --c-line:      #2c2b52;
  --c-hair:      #20223f;
  --c-text:      #efe6cf;
  --c-text-mute: #b6a888;
  --c-gold:      #d4af5a;
  --c-gold-soft: rgba(212,175,90,.40);
  --c-accent:    #cca84e;   /* 金（ボタン）*/
  --c-accent-2:  #a98cdb;   /* 紫（副アクセント）*/
  --c-on-accent: #161126;   /* 金ボタン上の濃色文字 */

  color:var(--c-text);
  background-color:var(--c-bg);
  background-image:
    radial-gradient(ellipse 90% 60% at 50% -5%,  rgba(169,140,219,.14), transparent 60%),
    radial-gradient(ellipse 70% 55% at 85% 80%,  rgba(212,175,90,.10), transparent 58%),
    radial-gradient(ellipse 60% 50% at 12% 70%,  rgba(120,90,200,.10), transparent 55%);
  background-attachment:fixed;
}

/* ヒーロー背景もダークの星空グラデへ */
body.ura-page .hero__bg{
  background:
    radial-gradient(ellipse 80% 55% at 50% 0%,  rgba(169,140,219,.18), transparent 60%),
    radial-gradient(ellipse 60% 50% at 84% 82%, rgba(212,175,90,.10), transparent 55%),
    var(--c-bg);
}
body.ura-page .hero__bg::after{ opacity:.25; }      /* 微粒子は薄く */
body.ura-page .hero__bg::before{                     /* 同心円は金で */
  background:
    radial-gradient(circle, transparent 58%, rgba(212,175,90,.10) 58.4%, transparent 60%),
    radial-gradient(circle, transparent 72%, rgba(169,140,219,.10) 72.3%, transparent 74%);
  opacity:.9;
}

/* ナビ・フッターをダークに馴染ませる */
body.ura-page .topnav{
  background:rgba(11,13,26,.72);
  border-bottom:1px solid var(--c-line);
  backdrop-filter:saturate(140%) blur(8px);
}
body.ura-page .topnav__brand,
body.ura-page .topnav__links a{ color:var(--c-text); }
body.ura-page .topnav__links a.is-active{ color:var(--c-gold); }
body.ura-page .site-footer{ border-top:1px solid var(--c-line); }

/* タイトルの金グロー */
body.ura-page .hero__title{ color:var(--c-text); text-shadow:0 0 28px rgba(212,175,90,.18); }
body.ura-page .hero__title .accent{ color:var(--c-gold); }
body.ura-page .hero__title .accent::after{ background:var(--c-gold); opacity:.30; }
body.ura-page .deco-eyebrow span{ color:var(--c-text-mute); }
body.ura-page .deco-eyebrow i{ background:var(--c-line); }

/* チップ・装飾 */
body.ura-page .hero__chips li{
  background:rgba(212,175,90,.08);
  border:1px solid var(--c-gold-soft);
  color:var(--c-text);
}

/* 入力フォーム（ダーク面 + 金枠）*/
body.ura-page .diagnose-form{
  background:linear-gradient(180deg, rgba(22,26,54,.92), rgba(16,19,40,.92));
  border:1px solid var(--c-line);
  box-shadow:0 24px 60px -28px rgba(0,0,0,.7), inset 0 0 0 1px rgba(212,175,90,.06);
}
body.ura-page .form-title{ color:var(--c-gold); }
body.ura-page .field label{ color:var(--c-text); }
body.ura-page .field input[type="text"],
body.ura-page .select-wrap select{
  background:#0f1228;
  border:1px solid var(--c-line);
  color:var(--c-text);
}
body.ura-page .select-wrap i{ color:var(--c-text-mute); }
body.ura-page .seg__item span{
  background:#0f1228; border:1px solid var(--c-line); color:var(--c-text-mute);
}
body.ura-page .seg__item input:checked + span{
  background:rgba(212,175,90,.16); border-color:var(--c-gold); color:var(--c-gold);
}

/* ボタン：金グラデ */
body.ura-page .btn--primary{
  color:var(--c-on-accent);
  background:linear-gradient(135deg,#e6c873,#c79a3e);
  box-shadow:0 14px 30px -14px rgba(212,175,90,.6);
}
body.ura-page .btn--primary:hover{ box-shadow:0 18px 36px -14px rgba(212,175,90,.75); }
body.ura-page .btn--ghost{ color:var(--c-text); border-color:var(--c-line); }
body.ura-page .btn--ghost:hover{ border-color:var(--c-gold); color:var(--c-gold); }
/* もう一度診断する：1ボタンなので中央寄せ（デスクトップの2カラムを打ち消す）*/
body.ura-page .result__actions{ grid-template-columns:1fr; max-width:360px; margin-inline:auto; }

/* ローディング・ゲートもダークに */
body.ura-page .screen.gate{ background:var(--c-bg); }
body.ura-page .gate__panel{ background:linear-gradient(180deg,#15183a,#0c0e22); }
body.ura-page .gate__text{ color:var(--c-text); }

/* ===== 結果カード（裏タイプ）===== */
.ura-result{ padding:clamp(20px,5vw,40px) 0 70px; }
.ura-card{
  position:relative;
  max-width:var(--maxw); margin-inline:auto;
  padding:clamp(26px,6vw,46px) clamp(20px,5vw,38px);
  border-radius:var(--radius);
  background:
    radial-gradient(ellipse 120% 70% at 50% 0%, rgba(169,140,219,.14), transparent 60%),
    linear-gradient(180deg, #14173200, #101329);
  border:1px solid var(--c-line);
  box-shadow:0 30px 80px -36px rgba(0,0,0,.8), inset 0 0 0 1px rgba(212,175,90,.08);
  overflow:hidden;
}
.ura-card__seal{                 /* 上部の金ライン装飾 */
  position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, transparent, var(--c-gold), transparent);
  opacity:.7;
}
.ura-kicker{
  text-align:center; color:var(--c-text-mute);
  font-size:.78rem; letter-spacing:.22em; margin-bottom:6px;
}
.ura-kicker b{ color:var(--c-gold); font-weight:700; }
.ura-label{
  text-align:center; font-family:var(--f-serif);
  font-size:clamp(1.9rem,7vw,2.7rem); font-weight:800;
  color:var(--c-text); letter-spacing:.02em;
  margin:2px 0 10px; text-shadow:0 0 30px rgba(212,175,90,.28);
}
.ura-label .spark{ color:var(--c-gold); font-size:.7em; vertical-align:.18em; margin:0 .3em; }
.ura-char{
  width:min(74%,300px); margin:clamp(6px,2vw,14px) auto clamp(20px,5vw,30px);
  filter:drop-shadow(0 10px 30px rgba(212,175,90,.25));
}
.ura-char img{ width:100%; border-radius:14px; }

/* 各セクション */
.ura-sec{
  margin-top:clamp(18px,4.5vw,28px);
  padding-top:clamp(16px,4vw,24px);
  border-top:1px solid var(--c-line);
}
.ura-sec__h{
  display:flex; align-items:baseline; gap:10px;
  font-family:var(--f-serif); font-size:clamp(1.1rem,4.6vw,1.32rem);
  font-weight:700; color:var(--c-gold); margin-bottom:.6em;
  letter-spacing:.04em;
}
.ura-sec__en{
  font-family:var(--f-sans); font-size:.62rem; font-weight:500;
  letter-spacing:.18em; color:var(--c-text-mute); text-transform:uppercase;
}
.ura-body{ color:var(--c-text); line-height:1.95; }
.ura-body p{ margin-bottom:.9em; }
.ura-body p:last-child{ margin-bottom:0; }
.ura-body p.lead{ color:#fff; }

/* ブラックな一面：少し赤紫を効かせる */
.ura-sec--black .ura-sec__h{ color:#d98ca6; }
.ura-sec--black{
  background:linear-gradient(180deg, rgba(120,40,70,.10), transparent);
  border-radius:14px; padding:clamp(16px,4vw,22px); border-top:none;
  margin-top:clamp(20px,5vw,30px);
}

/* 実は…な一面 */
.ura-secrets{ list-style:none; display:grid; gap:12px; }
.ura-secret{
  display:flex; gap:12px; align-items:flex-start;
  background:rgba(212,175,90,.07);
  border:1px solid var(--c-gold-soft);
  border-radius:12px; padding:14px 16px;
}
.ura-secret__tag{
  flex:0 0 auto; color:var(--c-on-accent);
  background:linear-gradient(135deg,#e6c873,#c79a3e);
  font-size:.72rem; font-weight:800; letter-spacing:.06em;
  padding:3px 10px; border-radius:999px; margin-top:.15em; white-space:nowrap;
}
.ura-secret__txt{ color:var(--c-text); font-weight:500; line-height:1.7; }

/* キャラのふわっと浮上（既存 char-in を流用しつつ単体定義）*/
.char-in{ animation:uraCharIn .9s var(--ease) both; }
@keyframes uraCharIn{ from{ opacity:0; transform:translateY(14px) scale(.96); } to{ opacity:1; transform:none; } }

/* ===== 結果：裏の顔の画像 ＋ LINE誘導ティーザー ===== */
.ura-card{ text-align:center; }
.ura-photo{
  position:relative; width:min(72%,280px);
  margin:clamp(8px,3vw,16px) auto clamp(18px,4vw,26px);
  aspect-ratio:1;
}
.ura-photo img{
  position:relative; z-index:1;
  width:100%; height:100%; object-fit:contain;
  filter:drop-shadow(0 12px 34px rgba(212,175,90,.32));
}
.ura-photo__ring{
  position:absolute; inset:-6%; border-radius:50%; z-index:0;
  background:radial-gradient(circle at 50% 42%, rgba(212,175,90,.16), transparent 62%);
}
.ura-photo__ring::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  border:1px dashed rgba(212,175,90,.30);
  animation:uraSpin 26s linear infinite;
}
@keyframes uraSpin{ to{ transform:rotate(360deg); } }

.ura-reveal{
  font-family:var(--f-serif); font-weight:800;
  font-size:clamp(1.5rem,6.6vw,2.1rem); line-height:1.5;
  color:var(--c-text); letter-spacing:.02em;
  margin-bottom:clamp(12px,3vw,16px);
  text-shadow:0 0 30px rgba(212,175,90,.22);
}
.ura-reveal span{ color:var(--c-gold); }
.ura-reveal__sub{
  color:var(--c-text-mute); font-size:clamp(.9rem,3.6vw,1rem); line-height:1.85;
  margin-bottom:clamp(20px,5vw,28px);
}
.ura-reveal__btn{ max-width:360px; margin:0 auto; }

@media (prefers-reduced-motion: reduce){
  .ura-photo__ring::after{ animation:none; }
}

/* 監修者紹介ブロック（ダーク版）*/
body.ura-page .supervisor{
  background-color:#12152c;
  background-image:
    radial-gradient(ellipse 62% 52% at 16% 18%, rgba(169,140,219,.12), transparent 60%),
    radial-gradient(ellipse 56% 50% at 86% 80%, rgba(212,175,90,.10), transparent 56%);
  border:1px solid var(--c-gold-soft);
  box-shadow:0 24px 60px -30px rgba(0,0,0,.75);
}
body.ura-page .supervisor .deco-eyebrow span{ color:var(--c-gold); }
body.ura-page .profile__photo img{ border-color:var(--c-gold-soft); background:#0f1228; }
body.ura-page .profile__role{
  background:linear-gradient(135deg,#e6c873,#c79a3e); color:var(--c-on-accent);
}
body.ura-page .profile__text p:not(.profile__name):not(.profile__role){ color:var(--c-text); }
body.ura-page .profile__text b{ color:var(--c-gold); }

/* LINE誘導CTA（ダーク版・ロック装飾なし）*/
.ura-cta{
  margin-top:clamp(26px,6vw,38px);
  padding:clamp(24px,6vw,34px) clamp(20px,5vw,30px);
  text-align:center;
  border-radius:16px;
  background:
    radial-gradient(ellipse 120% 80% at 50% 0%, rgba(212,175,90,.12), transparent 60%),
    linear-gradient(180deg, rgba(22,26,54,.9), rgba(14,17,38,.9));
  border:1px solid var(--c-gold-soft);
  box-shadow:inset 0 0 0 1px rgba(212,175,90,.06);
}
.ura-cta__seal{
  display:inline-grid; place-items:center;
  width:42px; height:42px; margin-bottom:10px;
  color:var(--c-gold); font-size:1.05rem;
  border:1px solid var(--c-gold-soft); border-radius:50%;
}
.ura-cta__lead{
  font-family:var(--f-serif); font-weight:800;
  font-size:clamp(1.12rem,4.8vw,1.42rem); line-height:1.5;
  color:var(--c-text); margin-bottom:16px;
}
.ura-cta__lead b{ color:var(--c-gold); }
.ura-cta .btn--line{ margin-inline:auto; }

.ura-result .result__disclaimer{ color:var(--c-text-mute); margin-top:22px; }

@media (prefers-reduced-motion: reduce){
  .char-in{ animation:none; }
}
