:root { --primary:#4f2378; --secondary:#9569b6; --bg:#f7f1fb; --gold:#b88732; --text:#332a37; --line:rgba(79,35,120,.14); }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; min-height:100vh; color:var(--text); font-family:"Noto Sans JP",sans-serif; background:radial-gradient(circle at 50% 10%,#fff 0,#faf6fc 38%,#f1e6f6 100%); }
button,input { font:inherit; }
button { cursor:pointer; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
.quiz-header { display:flex; max-width:1040px; align-items:center; justify-content:space-between; margin:auto; padding:22px 28px; }
.quiz-logo { color:var(--primary); font-family:"Noto Serif JP",serif; font-size:13px; font-weight:700; letter-spacing:.18em; text-decoration:none; }
.quiz-save { margin:0; color:#726a75; font-size:11px; }
.quiz-save span { color:var(--gold); }
.quiz { display:grid; min-height:calc(100vh - 76px); place-items:center; padding:30px 20px 70px; }
.quiz-intro,.quiz-profile { width:min(100%,680px); text-align:center; }
.quiz-eyebrow { margin:0 0 18px; color:var(--gold); font-family:"Noto Serif JP",serif; font-size:10px; font-weight:700; letter-spacing:.25em; }
.quiz-intro h1,.quiz-profile h2 { margin:0 0 22px; color:var(--primary); font-family:"Noto Serif JP",serif; font-size:clamp(30px,5vw,48px); line-height:1.55; letter-spacing:.05em; }
.quiz-intro__lead,.quiz-profile>p:not(.quiz-eyebrow):not(.quiz-error) { max-width:560px; margin:0 auto 26px; color:#625a66; font-family:"Noto Serif JP",serif; font-size:14px; line-height:2; }
.quiz-intro__meta { display:flex; justify-content:center; gap:12px; margin-bottom:32px; }
.quiz-intro__meta span { padding:7px 15px; border:1px solid var(--line); background:rgba(255,255,255,.65); color:var(--primary); font-size:11px; }
.quiz-primary { display:flex; width:min(100%,360px); align-items:center; justify-content:space-between; margin:0 auto; padding:18px 22px; border:1px solid var(--primary); background:var(--primary); color:#fff; font-family:"Noto Serif JP",serif; letter-spacing:.06em; }
.quiz-notice { margin:18px 0 0; color:#867e88; font-size:10px; }
.quiz-stage { width:min(100%,760px); }
.quiz-stage #quizForm,.quiz-stage .quiz-progress { transition:opacity .18s ease,transform .18s ease; }
.quiz-stage.is-question-leaving #quizForm,.quiz-stage.is-question-leaving .quiz-progress { opacity:0; transform:translateY(8px); }
.quiz-stage.is-question-entering #quizForm,.quiz-stage.is-question-entering .quiz-progress,.quiz-profile.is-entering { animation:quizQuestionIn .36s ease both; }
.quiz-progress { margin-bottom:18px; }
.quiz-progress__row { display:flex; justify-content:space-between; margin-bottom:10px; color:#756b79; font-size:11px; letter-spacing:.06em; }
.quiz-progress__row b { color:var(--primary); font-size:15px; }
.quiz-progress__row small { margin-left:10px; padding-left:10px; border-left:1px solid var(--line); color:#8a7f8e; font-size:10px; font-weight:400; }
.quiz-progress__track { display:block; height:3px; overflow:hidden; background:#e8dced; }
.quiz-progress__track span { display:block; height:100%; background:linear-gradient(90deg,var(--gold),var(--primary)); transition:width .3s ease; }
.quiz-card { min-height:430px; margin:0; padding:clamp(32px,6vw,58px); border:1px solid var(--line); border-top:3px solid var(--primary); background:rgba(255,255,255,.94); box-shadow:0 24px 60px rgba(79,35,120,.1); }
.quiz-card__number { margin:0 0 15px; color:var(--gold); font-family:"Noto Serif JP",serif; font-size:10px; font-weight:700; letter-spacing:.18em; }
.quiz-card h2 { margin:0; outline:none; color:var(--primary); font-family:"Noto Serif JP",serif; font-size:clamp(21px,3vw,28px); line-height:1.75; letter-spacing:.025em; }
.quiz-card__hint { margin:12px 0 7px; color:#746c77; font-size:12px; }
.quiz-auto-note { margin:0 0 24px; color:var(--secondary); font-size:10px; letter-spacing:.03em; }
.quiz-auto-note::before { margin-right:5px; content:"✓"; }
.quiz-auto-note.is-manual { color:#8a7f8e; }
.quiz-auto-note.is-manual::before { content:"○"; }
.quiz-status { min-height:18px; margin:12px 0 0; color:var(--primary); font-size:10px; }
.quiz-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.quiz-option { position:relative; display:flex; min-height:68px; align-items:center; gap:13px; padding:14px 18px; border:1px solid var(--line); background:#fff; cursor:pointer; transition:.18s; }
.quiz-option:hover { border-color:var(--secondary); transform:translateY(-1px); }
.quiz-option.is-selected { border-color:var(--primary); background:var(--bg); box-shadow:0 0 0 1px var(--primary) inset; }
.quiz-option:focus-within { border-color:var(--primary); outline:3px solid rgba(79,35,120,.1); outline-offset:2px; }
.quiz-option input { position:absolute; opacity:0; }
.quiz-option__marker { display:grid; width:28px; height:28px; flex:none; place-items:center; border:1px solid #cfc3d5; border-radius:50%; color:var(--primary); font-family:"Noto Serif JP",serif; font-size:11px; }
.quiz-option.is-selected .quiz-option__marker { border-color:var(--primary); background:var(--primary); color:#fff; }
.quiz-option__text { color:var(--text); font-size:13px; }
.quiz-option__check { margin-left:auto; color:var(--primary); opacity:0; }
.quiz-option.is-selected .quiz-option__check { opacity:1; }
.quiz-options--level { grid-template-columns:repeat(3,1fr); gap:14px; }
.quiz-options--level .quiz-option { display:grid; min-height:0; grid-template-columns:30px 1fr 22px; gap:8px; padding:10px; overflow:hidden; }
.quiz-options--level .quiz-option__image { grid-column:1 / -1; display:block; overflow:hidden; aspect-ratio:1 / 1; background:#faf9fa; }
.quiz-options--level .quiz-option__image img { width:100%; height:100%; object-fit:cover; transition:transform .25s ease; }
.quiz-options--level .quiz-option:hover .quiz-option__image img { transform:scale(1.025); }
.quiz-options--level .quiz-option__marker { grid-column:1; grid-row:2; }
.quiz-options--level .quiz-option__text { grid-column:2; grid-row:2; align-self:center; font-family:"Noto Serif JP",serif; font-weight:600; }
.quiz-options--level .quiz-option__check { grid-column:3; grid-row:2; align-self:center; }
.quiz-options--color { grid-template-columns:repeat(5,1fr); }
.quiz-options--color .quiz-option { flex-direction:column; justify-content:center; padding:15px 8px; text-align:center; }
.quiz-options--color .quiz-option__marker { width:34px; height:34px; border:0; }
.quiz-options--color [data-color="B"] .quiz-option__marker { background:#e7edf2; }.quiz-options--color [data-color="Y"] .quiz-option__marker { background:#eadb9b; }.quiz-options--color [data-color="P"] .quiz-option__marker { background:#e6b7be; }.quiz-options--color [data-color="R"] .quiz-option__marker { background:#c87878; }.quiz-options--color [data-color="C"] .quiz-option__marker { background:#a87863; }
.quiz-actions { display:flex; justify-content:space-between; margin-top:18px; }
.quiz-back,.quiz-next { padding:13px 2px; border:0; background:transparent; color:#776e7a; font-size:12px; }
.quiz-next { position:relative; isolation:isolate; min-width:150px; overflow:hidden; padding:13px 18px; border:1px solid var(--primary); background:transparent; color:#fff; transition:color .22s ease,border-color .22s ease; }
.quiz-next::before { position:absolute; z-index:-1; inset:0; background:var(--primary); content:""; transform:scaleX(0); transform-origin:left center; transition:transform .9s cubic-bezier(.22,1,.36,1); }
.quiz-next.is-fill-resetting::before { transition:none; }
.quiz-next:not(:disabled)::before { transform:scaleX(1); }
.quiz-next:disabled { border-color:#d6cdd9; background:#d6cdd9; color:#fff; cursor:default; }
.quiz-error { min-height:20px; margin:12px 0 0; color:#a34f58; font-size:11px; }
.quiz-profile label { display:block; margin:0 auto 8px; text-align:left; width:min(100%,420px); color:var(--primary); font-size:12px; }
.quiz-profile input { display:block; width:min(100%,420px); margin:0 auto; padding:17px 18px; border:1px solid var(--line); outline:none; background:#fff; font-size:16px; }
.quiz-profile input:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(79,35,120,.08); }
.quiz-profile .quiz-primary { margin-top:14px; }
.quiz-profile .quiz-back { margin-top:12px; }

/* Figma: diagnosis start screen */
body:has(#quizIntro:not([hidden])) { background:linear-gradient(136deg,#efe4fb 0%,#f4ecfb 24%,#fff 48%,#f2e8f5 100%); }
body:has(#quizIntro:not([hidden])) .quiz-header { display:none; }
body:has(#quizIntro:not([hidden])) .quiz { min-height:100vh; padding:63px 20px 40px; overflow:hidden; }
.quiz-intro { position:relative; isolation:isolate; width:1156px; max-width:none; flex:none; transform-origin:top center; }
.quiz-intro__decor { position:absolute; z-index:-1; max-width:none; pointer-events:none; }
.quiz-intro__decor--left { top:530px; left:-188px; width:380px; filter:blur(1.5px); transform:rotate(180deg) scaleY(-1); }
.quiz-intro__decor--right { top:443px; left:1026px; width:665px; filter:blur(2.5px); transform:rotate(-14.5deg); }
.quiz-intro__petal-frame { position:absolute; z-index:-1; display:block; width:410px; height:941px; overflow:hidden; pointer-events:none; }
.quiz-intro__petal-frame img { position:absolute; top:0; width:941px; height:941px; max-width:none; object-fit:contain; opacity:.7; }
.quiz-intro__petal-frame--left { top:27px; left:-236px; filter:blur(5px); }
.quiz-intro__petal-frame--left img { left:0; }
.quiz-intro__petal-frame--right { top:-265px; left:1059px; filter:blur(22.5px); }
.quiz-intro__petal-frame--right img { left:-368px; }
.quiz-intro__petal-frame--right-lower { display:none; }
.quiz-intro__panel { position:relative; min-height:711px; overflow:hidden; border-radius:40px; background:linear-gradient(180deg,rgba(251,244,252,.96),rgba(240,231,245,.96)); box-shadow:0 0 20px #d9d0d8; }
.quiz-intro__panel-petals { position:absolute; z-index:0; top:135px; left:105px; width:990px; height:990px; max-width:none; opacity:.62; filter:blur(15px); pointer-events:none; }
.quiz-intro__copy-sp { position:absolute; z-index:3; inset:0; display:block; pointer-events:none; }
.quiz-intro__copy-sp img,.quiz-intro__sp-rule { position:absolute; display:block; max-width:none; }
.quiz-intro__sp-eyebrow { top:55px; left:356px; width:210px; height:8px; }
.quiz-intro__sp-title,.quiz-intro__sp-title-stroke { top:80px; left:329px; width:270px; height:41.2px; }
.quiz-intro__sp-rule { top:136px; left:272px; width:383px; height:2px; background:url("../assets/images/diagnosis-start/pc-title-rule.svg") center/100% 100% no-repeat; }
.quiz-intro__sp-catch,.quiz-intro__sp-catch-stroke { top:149px; left:277px; width:374px; height:24.8px; }
.quiz-intro__sp-lead { top:208px; left:184px; width:560px; height:40px; }
.quiz-intro__sp-message-prefix { top:277px; left:312px; width:89px; height:27.8px; }
.quiz-intro__sp-message-main { top:275px; left:416px; width:216px; height:31px; }
.quiz-intro__sp-message-underline { top:304px; left:403px; width:206px; height:21px; }
.quiz-intro__achievement { position:absolute; z-index:5; top:-33px; left:-47px; width:260px; height:260px; object-fit:contain; }
.quiz-intro__copy { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); clip-path:inset(50%); white-space:nowrap; }
.quiz-intro__english { position:absolute; top:54px; left:356px; margin:0; color:#554039; font-family:"Noto Serif JP",serif; font-size:12px; font-weight:400; line-height:1; letter-spacing:.02em; white-space:nowrap; }
.quiz-intro .quiz-intro__copy h1 { position:absolute; top:72px; left:329px; margin:0; color:#644166; font-family:"Noto Serif JP",serif; font-size:45px; font-weight:600; line-height:1.15; letter-spacing:.08em; white-space:nowrap; }
.quiz-intro .quiz-intro__copy h1::after { position:absolute; top:63px; left:-57px; width:383px; height:2px; background:url("../assets/images/diagnosis-start/pc-title-rule.svg") center/100% 100% no-repeat; content:""; }
.quiz-intro__catch { position:absolute; top:151px; left:277px; margin:0; color:#783da6; font-family:"Noto Serif JP",serif; font-size:25px; line-height:1.25; letter-spacing:.035em; white-space:nowrap; }
.quiz-intro .quiz-intro__lead { position:absolute; top:207px; left:64px; width:800px; max-width:none; margin:0; color:#554039; font-family:"Noto Sans JP",sans-serif; font-size:16px; line-height:1.5; text-align:center; white-space:nowrap; }
.quiz-intro__message { position:absolute; top:272px; left:294px; width:340px; margin:0; color:#554039; font-family:"Noto Serif JP",serif; font-size:28px; line-height:1.2; letter-spacing:.1em; text-align:center; white-space:nowrap; }
.quiz-intro__message span { position:relative; margin-left:10px; color:#783da6; font-size:31px; }
.quiz-intro__message span::after { position:absolute; right:-3px; bottom:-15px; left:-3px; height:21px; background:url("../assets/images/diagnosis-start/pc-message-underline.svg") center/100% 100% no-repeat; content:""; }
.quiz-intro__woman { position:absolute; z-index:1; right:-1%; bottom:-102px; width:102%; height:auto; }
.quiz-intro__supervisor { position:absolute; z-index:4; right:164px; bottom:47px; width:217px; height:217px; object-fit:contain; }
.quiz-intro__features { position:absolute; z-index:4; left:105px; bottom:122px; display:grid; width:637px; min-height:242px; grid-template-columns:repeat(3,1fr); padding:46px 30px 18px; border-radius:30px; background:#fff; box-shadow:0 0 20px #d9d0d8; }
.quiz-intro__features-title { position:absolute; top:9px; left:0; width:100%; margin:0; color:#783da6; font-family:"Noto Serif JP",serif; font-size:18px; letter-spacing:.08em; }
.quiz-intro__feature { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; padding:0 15px; border-right:1px solid #eadfee; }
.quiz-intro__feature:last-child { border:0; }
.quiz-intro__feature img { width:100px; height:100px; object-fit:contain; }
.quiz-intro__feature strong,.quiz-intro__feature small { display:block; font-family:"Noto Serif JP",serif; font-weight:600; }
.quiz-intro__feature strong { color:#783da6; font-size:16px; }
.quiz-intro__feature small { margin-top:6px; color:#554039; font-size:13px; }
.quiz-intro__actions { position:absolute; z-index:6; bottom:13px; left:198px; display:grid; width:536px; grid-template-columns:97px 1fr; align-items:center; }
.quiz-intro__time { z-index:2; display:block; width:97px; height:97px; object-fit:contain; }
.quiz-intro__actions .quiz-primary { width:439px; height:69px; margin-left:-91px; padding:0 28px 0 100px; border:0; border-radius:50px; background:linear-gradient(180deg,#bea8ca 0%,#783da6 88.462%); box-shadow:none; font-size:24px; font-weight:600; text-shadow:0 0 10px #783da6; white-space:nowrap; }
.quiz-intro__actions .quiz-primary img { width:11px; height:16px; flex:none; object-fit:contain; }
.quiz-intro__actions .quiz-primary:hover { filter:brightness(1.04); transform:translateY(-1px); }
.quiz-intro__actions .quiz-primary:focus-visible,.quiz-intro__history:focus-visible { outline:3px solid rgba(79,35,120,.28); outline-offset:3px; }
.quiz-intro__history { grid-column:1/-1; justify-self:center; margin-top:-1px; padding:8px 34px; border:1px solid #d9b98f; border-radius:30px; background:#fff; color:#554039; font-size:12px; text-decoration:none; }
.quiz-intro__trust { display:grid; width:90%; height:86px; grid-template-columns:repeat(4,1fr); margin:39px auto 0; padding:5px 0; border-radius:50px; background:#fff; box-shadow:0 0 20px #d9d0d8; }
.quiz-intro__trust p { display:grid; grid-template-columns:75px 1fr; margin:0; padding:0 18px; border-right:1px solid #eadfee; text-align:left; }
.quiz-intro__trust p:last-child { border:0; }
.quiz-intro__trust p>img { grid-row:1/3; align-self:center; width:75px; height:75px; object-fit:contain; }
.quiz-intro__trust small,.quiz-intro__trust strong { display:block; font-weight:400; }
.quiz-intro__trust small { align-self:end; color:#783da6; font-size:12px; }
.quiz-intro__trust strong { color:#554039; font-size:14px; }
.quiz-intro>.quiz-notice { display:none; }

@media(max-width:700px){
  body:has(#quizIntro:not([hidden])) .quiz { padding: 48px 16px; overflow:hidden; }
  .quiz-intro { width:365px; max-width:none; }
  .quiz-intro__decor--left { top:557px; left:-59px; width:375px; filter:blur(1.5px); }
  .quiz-intro__decor--right { display:block; top:161px; left:252px; width:307px; filter:blur(2.5px); transform:none; }
  .quiz-intro__petal-frame--left { top:5px; left:-74px; width:229px; height:525px; filter:blur(5px); }
  .quiz-intro__petal-frame--left img { width:525px; height:525px; }
  .quiz-intro__petal-frame--right { top:-405px; left:119px; width:410px; height:941px; }
  .quiz-intro__petal-frame--right-lower { top:-55px; left:168px; display:block; width:410px; height:941px; filter:blur(22.5px); }
  .quiz-intro__petal-frame--right-lower img { left:-368px; }
  .quiz-intro__panel { min-height:648px; border-radius:40px; }
  .quiz-intro__panel-petals { top:352px; left:-89px; width:556px; height:556px; opacity:.55; }
  .quiz-intro__achievement { top:-28px; left:-14px; width:124px; height:124px; }
  .quiz-intro__copy { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .quiz-intro__copy-sp { position:absolute; z-index:3; inset:0; display:block; pointer-events:none; }
  .quiz-intro__copy-sp img,.quiz-intro__sp-rule { position:absolute; display:block; max-width:none; }
  .quiz-intro__sp-eyebrow { top:34px; left:124px; width:126.5px; height:4.8px; }
  .quiz-intro__sp-title,.quiz-intro__sp-title-stroke { top:53.5px; left:110px; width:157.5px; height:24px; }
  .quiz-intro__sp-rule { top:84.5px; left:74px; width:227px; height:2px; background:linear-gradient(90deg,transparent,#c89fcb 15%,#c89fcb 85%,transparent); }
  .quiz-intro__sp-catch,.quiz-intro__sp-catch-stroke { top:100.8px; left:78px; width:210px; height:13.9px; }
  .quiz-intro__sp-lead { top:130px; left:28px; width:315px; height:22.4px; }
  .quiz-intro__sp-message-prefix { top:169.8px; left:103px; width:41.4px; height:13px; }
  .quiz-intro__sp-message-main { top:167.1px; left:154px; width:120.2px; height:17.2px; }
  .quiz-intro__sp-message-underline { top:183.6px; left:151px; width:123px; height:13.4px; }
  .quiz-intro__english { font-size:6px; }
  .quiz-intro .quiz-intro__copy h1 { font-size:25px; letter-spacing:.12em; }
  .quiz-intro__catch { margin:11px 0 8px; font-size:15px; }
  .quiz-intro .quiz-intro__lead { font-size:9px; line-height:1.6; white-space:nowrap; transform:scale(.94); }
  .quiz-intro__message { margin-top:10px; font-size:15px; }
  .quiz-intro__woman {
    right: -108px;
    bottom: -64px;
    width: clamp(815px, 205%, 940px);
    height: auto;
    max-width: none;
  }
  .quiz-intro__supervisor { right:25px; bottom:144px; width:107px; height:107px; }
  .quiz-intro__features { left:20px; bottom:150px; display:block; width:191px; min-height:291px; padding:44px 8px 10px; border-radius:20px; box-shadow:0 0 10px #d9d0d8; }
  .quiz-intro__features-title { top:15px; font-size:14px; }
  .quiz-intro__feature { height:78px; flex-direction:row; padding:0; border-right:0; border-bottom:1px solid #eadfee; text-align:left; }
  .quiz-intro__feature:last-child { border-bottom:0; }
  .quiz-intro__feature img { width:60px; height:60px; flex:none; }
  .quiz-intro__feature strong { font-size:13px; white-space:nowrap; }
  .quiz-intro__feature small { margin-top:5px; font-size:11px; line-height:1.5; }
  .quiz-intro__actions { bottom:22px; left:50%; transform: translate(-50%); width:calc(100% - 20px); grid-template-columns:90px 1fr; }
  .quiz-intro__time { width:90px; height:90px; }
  .quiz-intro__actions .quiz-primary { width:324px; height:57px; margin-left:-71px; padding:0 18px 0 80px; font-size:16px; }
  .quiz-intro__actions .quiz-primary img { width:9px; height:14px; }
  .quiz-intro__history { justify-self:start; width:204px; height:38px; margin:-3px 0 0 72px; padding:8px 12px; font-size:14px; line-height:20px; }
  .quiz-intro__trust { width:100%; height:103px; min-height:103px; margin-top:9px; padding:9px 2px; border-radius:50px; }
  .quiz-intro__trust p { display:block; padding:2px 5px; text-align:center; }
  .quiz-intro__trust p>img { display:block; width:34px; height:34px; margin:0 auto 1px; }
  .quiz-intro__trust small { font-size:10px; line-height:1.35; }
  .quiz-intro__trust strong { font-size:10px; line-height:1.35; }
  .quiz-intro>.quiz-notice { margin:12px 12px 0; font-size:8px; line-height:1.6; }
}
@media(max-width:600px){.quiz-header{padding:17px 18px}.quiz-save{font-size:9px}.quiz{place-items:start center;padding:24px 14px 50px}.quiz-intro h1{font-size:30px}.quiz-intro__lead{font-size:13px}.quiz-progress__row small{display:block;margin:2px 0 0;padding:0;border:0;text-align:right}.quiz-card{min-height:440px;padding:30px 20px}.quiz-card h2{font-size:20px;line-height:1.65}.quiz-card__hint{line-height:1.7}.quiz-auto-note{margin-bottom:20px;line-height:1.6}.quiz-options{grid-template-columns:1fr}.quiz-options--level{grid-template-columns:repeat(2,1fr);gap:10px}.quiz-options--level .quiz-option{padding:7px;grid-template-columns:25px 1fr 18px}.quiz-options--level .quiz-option__marker{width:25px;height:25px}.quiz-options--level .quiz-option__text{font-size:11px}.quiz-options--color{grid-template-columns:repeat(3,1fr)}.quiz-option{min-height:64px;padding:15px 16px}.quiz-actions{position:sticky;z-index:10;bottom:0;margin-right:-14px;margin-left:-14px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(250,246,252,.94);backdrop-filter:blur(10px)}.quiz-next{min-width:145px;min-height:46px;border-radius:2px}.quiz-back{min-height:46px}.quiz-intro__meta{gap:6px}.quiz-intro__meta span{padding:6px 10px}}

@keyframes quizQuestionIn { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }

@media(prefers-reduced-motion:reduce){.quiz-option,.quiz-progress__track span,.quiz-options--level .quiz-option__image img,.quiz-stage #quizForm,.quiz-stage .quiz-progress,.quiz-next::before{transition:none}.quiz-stage.is-question-entering #quizForm,.quiz-stage.is-question-entering .quiz-progress,.quiz-profile.is-entering{animation:none}.quiz-option:hover{transform:none}}
/* Header links shared by the diagnosis and the official site. */
.quiz-header__links { display: flex; align-items: center; gap: 24px; }
.quiz-header__links > a { color: #6d5265; font-size: 13px; text-underline-offset: 4px; }

@media (max-width: 700px) {
  .quiz-header__links { gap: 12px; }
  .quiz-header__links > a { font-size: 11px; white-space: nowrap; }
}

/* Mature editorial theme shared with the official Hair Shirube site. */
:root {
  --primary: #654455;
  --secondary: #9a8899;
  --bg: #f1ebe6;
  --gold: #a38b78;
  --text: #352d31;
  --line: rgba(101,68,85,.2);
}

body { background: #ede8e2; }
body:has(#quizIntro:not([hidden])) { background: #ede8e2; }
.quiz-header { background: rgba(255,253,249,.96); border-color: rgba(101,68,85,.16); }
.quiz-logo { color: #352d31; letter-spacing: .16em; }
.quiz-save, .quiz-progress__row, .quiz-card__hint, .quiz-back { color: #746a6d; }
.quiz-progress__track { background: #ded5d0; }
.quiz-progress__track span { background: #654455; }
.quiz-card { border: 1px solid rgba(101,68,85,.2); border-top: 3px solid #654455; background: #fffdf9; box-shadow: 0 16px 40px rgba(53,45,49,.07); }
.quiz-option { border-color: #d8cec6; background: #fffdf9; }
.quiz-option:hover { border-color: #9a8899; }
.quiz-option.is-selected { border-color: #654455; background: #f1ebe6; box-shadow: 0 0 0 1px #654455 inset; }
.quiz-option__marker { border-color: #bcaeb2; color: #654455; }
.quiz-option.is-selected .quiz-option__marker { border-color: #654455; background: #654455; }
.quiz-next { border-color: #654455; }
.quiz-next::before { background: #654455; }
.quiz-profile input { background: #fffdf9; }
.quiz-profile input:focus { border-color: #654455; box-shadow: 0 0 0 3px rgba(101,68,85,.09); }

.quiz-intro__panel {
  border: 1px solid rgba(101,68,85,.16);
  border-radius: 4px;
  background: #ede8e2;
  box-shadow: 0 18px 55px rgba(53,45,49,.1);
}
.quiz-intro__panel::after { position: absolute; inset: 16px; z-index: 2; border: 1px solid rgba(255,255,255,.68); content: ""; pointer-events: none; }
.quiz-intro__panel-petals, .quiz-intro__petal-frame { display: none; }
.quiz-intro__decor { opacity: .64; filter: saturate(.62); }
.quiz-intro__decor--left { top: 350px; left: -166px; width: 310px; transform: rotate(-10deg) scaleX(-1); }
.quiz-intro__decor--right { top: 95px; left: 1050px; width: 360px; transform: rotate(4deg); }
.quiz-intro__achievement { top: -20px; left: -24px; width: 190px; height: 190px; filter: saturate(.5) sepia(.12); }
.quiz-intro__supervisor { filter: saturate(.48) sepia(.14); }
.quiz-intro__features { border: 1px solid rgba(101,68,85,.14); border-radius: 4px; background: rgba(255,253,249,.95); box-shadow: 0 12px 35px rgba(53,45,49,.08); }
.quiz-intro__features-title, .quiz-intro__feature strong, .quiz-intro__catch, .quiz-intro__message span, .quiz-intro__trust small { color: #654455; }
.quiz-intro__feature { border-color: #ddd2cc; }
.quiz-intro__feature img { filter: saturate(.55) sepia(.08); }
.quiz-intro__actions { grid-template-columns: 1fr; }
.quiz-intro__time { display: none; }
.quiz-intro__actions .quiz-primary { width: 439px; margin: 0 auto; padding: 0 28px; border: 1px solid #654455; border-radius: 2px; background: #654455; box-shadow: none; text-shadow: none; }
.quiz-intro__actions .quiz-primary:hover { background: #49303d; filter: none; }
.quiz-intro__history { grid-column: 1; justify-self: center; margin-top: 7px; border-color: #bcaea7; border-radius: 1px; background: #fffdf9; color: #49303d; }
.quiz-intro__trust { border: 1px solid rgba(101,68,85,.13); border-radius: 4px; background: #fffdf9; box-shadow: 0 10px 30px rgba(53,45,49,.06); }
.quiz-intro__trust p { border-color: #ddd2cc; }
.quiz-intro__trust p > img { filter: saturate(.45) sepia(.12); }
.quiz-intro__sp-rule { background: linear-gradient(90deg,transparent,#9a8899 15%,#9a8899 85%,transparent); }
.quiz-intro__copy-sp img { filter: saturate(.55) sepia(.08) hue-rotate(292deg); }

@media (max-width: 700px) {
  .quiz-intro__panel { border-radius: 3px; }
  .quiz-intro__panel::after { inset: 8px; }
  .quiz-intro__decor--left { top: 430px; left: -76px; width: 180px; }
  .quiz-intro__decor--right { top: 105px; left: 300px; width: 180px; }
  .quiz-intro__achievement { top: -18px; left: -8px; width: 110px; height: 110px; }
  .quiz-intro__features { border-radius: 3px; box-shadow: 0 8px 24px rgba(53,45,49,.08); }
  .quiz-intro__actions { left: 50%; width: calc(100% - 32px); grid-template-columns: 1fr; }
  .quiz-intro__actions .quiz-primary { width: 100%; margin: 0; padding: 0 20px; }
  .quiz-intro__history { justify-self: center; width: 204px; margin: 7px 0 0; }
  .quiz-intro__trust { border-radius: 3px; }
}

@media (max-width: 600px) {
  .quiz-actions { background: rgba(246,242,236,.95); }
}

.quiz-level-notice { margin: 18px 0 0; color: var(--text); font-size: 12px; line-height: 1.8; }

@media (min-width: 901px) {
  body, body:has(#quizIntro:not([hidden])) { background-size: auto 1000px; }
}

/* FV mobile layout restored to the original composition (revision 2). */
