/* サイト共通のモチタン・トークンに揃える。プレイ中の配置は維持する。 */
:root{--ink:var(--color-text-primary);--muted:var(--color-text-secondary);--green:var(--color-accent-green-700);--mint:var(--color-primary-50);--paper:var(--color-base-light);--line:var(--color-base-divider);--yellow:var(--color-secondary-300);--shadow:var(--shadow-card);--diagnosis-navy:#005172;--diagnosis-hero-veil:linear-gradient(90deg,#fff7e8fa 0%,#fff7e8e8 56%,#fff7e870 100%);--diagnosis-hero-image:url('../image/hero_motibear_town.jpg?v=2');--diagnosis-title:clamp(28px,3.3vw,40px);--diagnosis-body:17px;--diagnosis-small:14px;--diagnosis-heading:clamp(24px,3vw,32px);font-family:var(--font-family-base)}
.diagnosis-nav{max-width:1060px;padding-top:var(--space-2)}.diagnosis-nav a,.next-study a,.app-details{color:var(--diagnosis-navy)}
main{max-width:1060px;padding-top:var(--space-4)}
.intro{position:relative;isolation:isolate;gap:var(--space-4);grid-template-columns:minmax(0,1fr)}
.intro-copy{position:relative;background-image:var(--diagnosis-hero-veil),var(--diagnosis-hero-image);background-position:center;background-size:cover;border-radius:var(--radius-lg);padding:var(--space-5);border:1px solid var(--line)}
.intro-copy h1{font-size:var(--diagnosis-title);line-height:1.5;color:var(--diagnosis-navy)}
.intro-copy h1 span{color:var(--diagnosis-navy);background:linear-gradient(transparent 66%,var(--yellow) 66%,var(--yellow) 94%,transparent 94%)}
.intro .hero-art{display:none}.intro .eyebrow{letter-spacing:.06em;font-size:var(--diagnosis-small);color:var(--diagnosis-navy)}.intro .lead{font-size:var(--diagnosis-body);max-width:38em}.language-setting{margin-bottom:var(--space-4)}
.eyebrow{color:var(--diagnosis-navy)}.setup{border-radius:var(--radius-lg)}
.primary{background:var(--diagnosis-navy);box-shadow:0 4px 0 var(--color-text-primary);color:var(--color-base-white)}.primary:hover{background:var(--color-text-primary)}
.courses input:checked+span{color:var(--diagnosis-navy);border-color:var(--diagnosis-navy);box-shadow:inset 0 0 0 1px var(--diagnosis-navy);background:var(--color-primary-50)}
.result{max-width:800px}.result>.eyebrow{margin-bottom:var(--space-2)}.result h1{font-size:var(--diagnosis-title);color:var(--diagnosis-navy)}
.result-level{background:var(--color-primary-50);border-color:var(--color-primary-300);text-align:left;padding:var(--space-5);box-shadow:var(--shadow-card);border-radius:var(--radius-lg)}
.result-level strong{color:var(--diagnosis-navy);line-height:1.45}.result-level p{font-size:var(--diagnosis-body)}
.result-stats{padding:var(--space-4) var(--space-3);border-radius:var(--radius-md);background:var(--color-base-white);gap:var(--space-4)}.result-stats b{color:var(--diagnosis-navy)}
.result>.footnote{font-size:var(--diagnosis-small);text-align:left;line-height:1.8}
.app-growth{margin:var(--space-5) 0;border:2px solid var(--color-festival-orange-soft);background:var(--color-base-white);border-radius:var(--radius-lg);padding:var(--space-5);text-align:left;box-shadow:var(--shadow-card)}
.growth-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(64px,18%);align-items:center;gap:var(--space-3)}
.growth-heading>img{width:100%;height:auto}.growth-kicker{font-size:var(--diagnosis-small);font-weight:var(--font-weight-bold);color:var(--diagnosis-navy);margin:0 0 var(--space-2)}
.growth-heading h2{font-size:var(--diagnosis-heading);line-height:1.5;text-wrap:balance;margin:0;color:var(--ink)}
.growth-observation{font-size:var(--diagnosis-body);line-height:1.9;margin:var(--space-4) 0;color:var(--muted)}
.growth-goal{border-radius:var(--radius-md);background:var(--color-base-light);padding:var(--space-4);display:grid;gap:var(--space-2)}
.growth-goal span{font-size:var(--diagnosis-small);color:var(--muted)}.growth-goal strong{font-size:var(--font-size-heading-md);line-height:1.6}
.growth-steps{list-style:none;counter-reset:steps;padding:0;margin:var(--space-4) 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}
.growth-steps li{counter-increment:steps;min-width:0}.growth-steps li::before{content:'0' counter(steps);display:inline-grid;place-items:center;background:var(--color-primary-50);color:var(--diagnosis-navy);border-radius:var(--radius-pill);font-weight:var(--font-weight-black);padding:var(--space-2);min-width:2em}
.growth-steps h3{font-size:var(--diagnosis-body);margin:var(--space-2) 0;line-height:1.6}.growth-steps p{font-size:var(--diagnosis-small);line-height:1.9;color:var(--muted);margin:0;overflow-wrap:anywhere}
.app-invitation{display:flex;align-items:center;gap:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--line);margin:var(--space-4) 0}.app-invitation img{width:28%;max-width:180px;height:auto}.app-invitation p{font-size:var(--diagnosis-body);line-height:1.8;font-weight:var(--font-weight-bold);margin:0}
.app-download{display:flex;align-items:center;justify-content:center;gap:var(--space-3);padding:var(--space-4) var(--space-3);background:var(--color-secondary-500);color:var(--color-text-primary);border-radius:var(--radius-md);text-decoration:none;font-size:var(--font-size-heading-md);font-weight:var(--font-weight-black);line-height:1.5;text-align:center;box-shadow:0 4px 0 var(--color-secondary-700)}
.app-download:hover{background:var(--color-festival-orange-soft)}.app-download:active{transform:translateY(2px)}.app-download:focus-visible,.app-details:focus-visible,.diagnosis-nav a:focus-visible{outline:3px solid var(--diagnosis-navy);outline-offset:4px}
.download-note{font-size:var(--diagnosis-small);text-align:center;color:var(--muted);margin:var(--space-3) 0 var(--space-2)}.app-details{display:block;text-align:center;font-size:var(--diagnosis-small);padding:var(--space-2);text-underline-offset:4px}
.next-study{background:transparent;box-shadow:none;border:0;padding:var(--space-3);margin:var(--space-3) 0}.next-study h2{font-size:var(--diagnosis-body)}
.result>#retry{background:var(--color-base-white);color:var(--diagnosis-navy);border:1px solid var(--line);box-shadow:none}
@media(max-width:700px){main{padding-left:var(--space-3);padding-right:var(--space-3)}.intro-copy{padding:var(--space-4)}.facts{font-size:var(--diagnosis-small)}.app-growth,.result-level{padding:var(--space-4)}.growth-steps{grid-template-columns:1fr;gap:var(--space-4)}.growth-steps li{position:relative;padding-left:var(--space-6)}.growth-steps li::before{position:absolute;left:0;top:0}.growth-steps h3{margin-top:0}.growth-steps p{font-size:var(--diagnosis-body)}.growth-goal{padding:var(--space-3)}.growth-goal strong{font-size:var(--diagnosis-body)}.app-download{font-size:var(--diagnosis-body)}.app-invitation{gap:var(--space-3)}.app-invitation p{font-size:var(--diagnosis-small)}.language-setting{font-size:var(--diagnosis-body)}}

/* 多言語は4コース。英語5コース用の最終カード拡張を解除する。 */
.courses.multilingual-courses{grid-template-columns:repeat(2,minmax(0,1fr))}
.courses.multilingual-courses label:last-child{grid-column:auto}
.courses.multilingual-courses label:last-child>span{display:block}
.courses.multilingual-courses label>span{height:100%}
.courses.multilingual-courses label:last-child small{display:block;margin:7px 0 0}

.share-box{grid-column:1/-1;border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-4);background:var(--color-base-white);text-align:left}
.result-share{margin-top:var(--space-4)}.share-box h2{font-size:var(--font-size-heading-md);color:var(--diagnosis-navy);margin:0 0 var(--space-2)}
.share-box p{font-size:var(--diagnosis-small);line-height:1.8;margin:0 0 var(--space-3)}
.share-actions{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.share-actions button{flex:1 1 auto;min-height:44px;border:1px solid var(--diagnosis-navy);border-radius:var(--radius-md);padding:var(--space-3);font-size:var(--diagnosis-body);font-weight:var(--font-weight-bold);background:var(--color-base-white);color:var(--diagnosis-navy)}
.share-actions button:first-child{background:var(--diagnosis-navy);color:var(--color-base-white)}.share-actions button:focus-visible{outline:3px solid var(--diagnosis-navy);outline-offset:4px}
.share-box .share-status:empty{display:none}.share-box .share-status{margin:var(--space-3) 0 0;color:var(--diagnosis-navy)}
.share-text{display:block;width:100%;min-height:10em;margin-top:var(--space-3);padding:var(--space-3);font:inherit;font-size:var(--diagnosis-body);line-height:1.8;resize:vertical;border:1px solid var(--line);border-radius:var(--radius-md)}

/* ===== 結果のアプリ案内（2026-10-16 社長「すぐやって 効果的に」）=====
 * 上: 結果のカードの中。スマホ（390px・Safari の見える範囲 664px）でスクロールせずにボタンまで見える高さに収める。
 * 「いまの目安 → 次のレベル」の印が案内の主役（アプリのコースの名前）。ボタンはオレンジ 1 つだけ。
 * 下: おすすめの後。枠線だけの控えめなボタン。 */
.result>.result-kicker{font-size:var(--diagnosis-small);font-weight:var(--font-weight-bold);letter-spacing:.04em;margin:0 0 var(--space-1)}
#result-title{margin:0 0 var(--space-3)}
.result .result-level{margin:var(--space-3) 0 var(--space-4)}
.result-level #level-label{margin:var(--space-2) 0}
.result-level #result-message{font-size:15px;line-height:1.7;color:var(--muted)}
.diag-cta{margin-top:var(--space-3);padding:var(--space-3);background:var(--color-base-white);border:1.5px solid var(--color-primary-300);border-radius:var(--radius-md);box-shadow:0 2px 0 rgba(13,42,78,.05),0 10px 24px rgba(13,42,78,.08)}
/* いま → 次 */
.diag-ladder{display:flex;align-items:stretch;gap:30px;list-style:none;margin:0 0 var(--space-3);padding:0}
.diag-ladder li{flex:1 1 0;min-width:0;position:relative;border-radius:14px;padding:7px 12px 8px}
.diag-ladder small{display:block;font-size:12px;font-weight:var(--font-weight-bold);line-height:1.5;color:var(--color-text-secondary)}
.result-level .diag-ladder b{display:block;font-size:17px;font-weight:var(--font-weight-black);line-height:1.35;color:var(--diagnosis-navy);overflow-wrap:anywhere}
.diag-ladder__now{background:var(--color-primary-50);border:1.5px solid var(--color-primary-300)}
.diag-ladder__next{background:var(--color-secondary-300);border:1.5px solid #e9bd12}
.diag-ladder__next::before{content:"";position:absolute;right:calc(100% + 9px);top:50%;width:14px;height:2px;margin-top:-1px;background:var(--diagnosis-navy);transform-origin:left center}
.diag-ladder__next::after{content:"";position:absolute;right:calc(100% + 4px);top:50%;margin-top:-5px;border:5px solid transparent;border-left:7px solid var(--diagnosis-navy);border-right:0}
.diag-ladder.is-single li{flex:0 1 auto}
.diag-ladder.is-on .diag-ladder__next{animation:diag-pop .5s var(--easing-bounce) .35s both}
.diag-ladder.is-on .diag-ladder__next::before{animation:diag-draw .35s ease-out both}
@keyframes diag-pop{from{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes diag-draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
/* アイコン＋見出し */
.diag-cta__main{display:flex;align-items:center;gap:var(--space-3)}
.diag-cta__icon{flex:0 0 auto;width:56px;height:56px;border-radius:13px;box-shadow:0 1px 3px rgba(13,42,78,.18)}
.result-level .diag-cta__text{margin:0;min-width:0;font-size:inherit;line-height:1.45}
.diag-cta__text small{display:block;font-size:12px;font-weight:var(--font-weight-bold);color:var(--color-text-secondary);margin-bottom:2px}
.result-level .diag-cta__title{display:block;margin:0;font-size:19px;font-weight:var(--font-weight-black);line-height:1.45;color:var(--color-text-primary);text-wrap:pretty}
.diag-cta__title span{display:inline}.diag-cta__title span+span{display:inline-block}
/* ボタン（1 つだけ） */
.diag-cta__btn{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px;margin-top:var(--space-3);padding:10px 16px;background:var(--color-secondary-500);color:var(--color-text-primary);border-radius:14px;box-shadow:0 4px 0 var(--color-secondary-700);font-size:19px;font-weight:var(--font-weight-black);line-height:1.3;text-decoration:none;text-align:center}
.diag-cta__btn::before{content:"";flex:0 0 auto;width:22px;height:22px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12M6.5 10 12 15.5 17.5 10M5 20h14'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12M6.5 10 12 15.5 17.5 10M5 20h14'/%3E%3C/svg%3E") center/contain no-repeat}
.diag-cta__btn::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);pointer-events:none;opacity:0}
.diag-ladder.is-on~.diag-cta__btn::after{animation:diag-shine 1.1s ease-in-out 1s 2}
@keyframes diag-shine{0%{left:-40%;opacity:1}100%{left:120%;opacity:1}}
.diag-cta__btn:hover{background:#ff7a26}.diag-cta__btn:active{transform:translateY(2px);box-shadow:0 2px 0 var(--color-secondary-700)}
.diag-cta__btn:focus-visible,.app-download--soft:focus-visible{outline:3px solid var(--diagnosis-navy);outline-offset:3px}
.result-level .diag-cta__note{margin:var(--space-2) 0 0;font-size:12px;line-height:1.5;color:var(--color-text-muted);text-align:center}
@media(min-width:700px){
  .diag-cta{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"ladder ladder" "main btn" "main note";column-gap:var(--space-4);align-items:center;padding:var(--space-4)}
  .diag-ladder{grid-area:ladder}.diag-ladder li{flex:0 1 auto;min-width:10.5em}.diag-cta__main{grid-area:main}
  .diag-cta__btn{grid-area:btn;width:auto;min-width:240px;margin-top:0;padding:10px 26px}
  .result-level .diag-cta__note{grid-area:note}
  .result-level .diag-cta__title{font-size:21px}
}
@media(max-width:700px){
  .result>.result-kicker{font-size:13px}
  #result-title{font-size:24px;margin-bottom:var(--space-2)}
  .result .result-level{padding:var(--space-3) var(--space-3) var(--space-3);margin:var(--space-2) 0 var(--space-4)}
  .result-level>span{font-size:14px}
  .result-level #level-label{font-size:28px;margin:2px 0 4px}
  .result-level #result-message{font-size:14px;line-height:1.6}
  .diag-cta{margin-top:var(--space-3);padding:14px}
  .diag-ladder{gap:26px;margin-bottom:12px}
  .diag-ladder li{padding:6px 8px 7px 10px}
  .result-level .diag-ladder b{font-size:15px}
  .diag-cta__main{gap:10px}
  .diag-cta__icon{width:48px;height:48px;border-radius:11px}
  .result-level .diag-cta__title{font-size:clamp(15px,calc((100vw - 160px) / 12),19px)}
  .diag-cta__btn{margin-top:12px;font-size:18px;min-height:54px}
}
/* 下の案内（控えめ） */
.diag-cta2{display:flex;align-items:center;gap:var(--space-3);padding-top:var(--space-4);border-top:1px solid var(--line);margin:var(--space-4) 0 var(--space-3)}
.diag-cta2 img{flex:0 0 auto;width:48px;height:48px;border-radius:11px}
.diag-cta2 p{margin:0;min-width:0;font-size:var(--diagnosis-small);line-height:1.7;color:var(--muted)}
.diag-cta2 b{display:block;font-size:var(--diagnosis-body);color:var(--ink)}
.app-download--soft{background:var(--color-base-white);color:var(--diagnosis-navy);border:2px solid var(--diagnosis-navy);box-shadow:none;border-radius:14px;font-size:var(--diagnosis-body);padding:var(--space-3)}
.app-download--soft:hover{background:var(--color-primary-50)}
.app-growth .download-note{font-size:12px}