/* 簡易リスク確認 v3（本番公開用）— v2 をそのまま引き継ぎ、末尾に v3 の追加分（結果の要約・詳細の開閉・相談フォームの送信状態）を足したもの。
   style-prevention-v2.css（副題・移動リンク）の後に読み込む。
   新しい色は作らず、既存の変数と第2〜3章で使っている暖色だけを使う。
   回答の種類は色だけでなく、左罫の太さと見出しの文言でも区別する。
   キャラクター・動物・吹き出しは使わない。 */

.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ------------------------------------------------------------------ 冒頭 */
.proto-banner{margin:18px 0 0;padding:14px 18px;border-radius:12px;background:var(--cream);
  border:1px solid #e3b48f;border-left:6px solid #c07a4e;font-size:15px;line-height:1.85;color:#5a3424}
.proto-banner strong{color:#6b3626}

.scope-note{margin:20px 0 0;padding:18px 20px;border-radius:14px;background:var(--paper);border:1px solid var(--line)}
.scope-note-title{margin:0 0 10px;font-size:16px;line-height:1.6;color:var(--clay)}
.scope-note ul{margin:0;padding-left:1.3em}
.scope-note li{margin:0 0 8px;font-size:15.5px;line-height:1.85;color:#40342e}
.scope-note li:last-child{margin-bottom:0}
.scope-note strong{color:#5a3424}

.start-row{margin:22px 0 0}

/* 共通のボタン。第2章の .btn と同じ形に合わせる。 */
.btn-primary,.btn-quiet{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:52px;padding:12px 26px;border-radius:10px;border:1px solid transparent;
  font-size:16px;font-weight:750;line-height:1.5;text-decoration:none;cursor:pointer;font-family:inherit}
.btn-primary{background:var(--cta);color:#fffdf9}
.btn-primary:hover{background:var(--cta-hover)}
.btn-quiet{background:var(--paper);color:var(--clay);border-color:var(--line)}
.btn-quiet:hover{background:#fff4e8}
.btn-primary:focus-visible,.btn-quiet:focus-visible{outline:3px solid var(--clay);outline-offset:3px}

/* JavaScript が無い場合・読み込めない場合 */
.nojs-note{margin:20px 0;padding:18px 20px;border-radius:14px;background:#fbeae1;
  border:1px solid #d99a86;border-left:6px solid #c0604a}
.nojs-note h2{margin:0 0 8px;font-size:17px;line-height:1.6;color:#6b3626}
.nojs-note p{margin:0 0 8px;font-size:15.5px;line-height:1.85;color:#4d3d35}
.nojs-note p:last-child{margin-bottom:0}
.loading-note{margin:0;color:var(--muted)}

/* ------------------------------------------------------------------ 設問 */
.question-list{display:grid;gap:16px;margin:18px 0 0}

.q-card{border-radius:14px;background:var(--paper);border:1px solid var(--line);
  border-left:6px solid #efe2d5;scroll-margin-top:calc(var(--header-h) + 16px)}
.q-card[data-answered="true"]{border-left-color:#e3b48f;background:#fffdfa}

.q-fieldset{margin:0;padding:18px 20px;border:0}
.q-legend{display:flex;gap:12px;align-items:baseline;padding:0;margin:0 0 8px}
.q-num{flex:none;display:inline-grid;place-items:center;min-width:46px;height:28px;padding:0 10px;
  border-radius:999px;background:var(--clay);color:var(--paper);font-size:13px;font-weight:800;line-height:1}
.q-text{font-size:17px;font-weight:750;line-height:1.65;color:var(--ink)}

.q-help{margin:0 0 6px;padding-left:58px;font-size:14px;line-height:1.8;color:var(--muted)}
.q-help-label{font-weight:750;color:var(--clay)}
.q-na-note{margin:0 0 6px;padding:8px 12px 8px 58px;font-size:14px;line-height:1.8;color:#58613b}

.q-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px;margin:12px 0 0;padding-left:58px}
.q-option{display:flex;align-items:center;gap:10px;min-height:46px;padding:8px 14px;border-radius:10px;
  background:var(--canvas);border:1px solid var(--line);cursor:pointer;font-size:15px;line-height:1.6}
.q-option:hover{background:#fff4e8}
.q-option input{flex:none;width:20px;height:20px;margin:0;accent-color:var(--clay)}
.q-option input:focus-visible{outline:3px solid var(--clay);outline-offset:3px}
.q-option:has(input:checked){background:var(--cream);border-color:#e3b48f;font-weight:700}
.q-option-label{min-width:0}

.form-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:22px 0 0}
.progress{flex:1 1 100%;margin:0;font-size:15px;font-weight:700;color:var(--clay)}

/* ------------------------------------------------------------------ 結果 */
.block.alt{background:#fdf4ea}
#result:focus{outline:none}
#result:focus-visible{outline:3px solid var(--clay);outline-offset:-3px}

.result-section{margin:26px 0 0;padding:20px;border-radius:14px;background:var(--paper);border:1px solid var(--line)}
.result-section-title{margin:0 0 8px;font-size:18px;line-height:1.6;color:var(--clay)}
.result-section-note{margin:0 0 12px;font-size:15px;line-height:1.85;color:#4d3d35}
.sub-title{margin:16px 0 6px;font-size:15.5px;line-height:1.6;color:#5a3424}

.risk-card{margin:12px 0 0;padding:16px 18px;border-radius:12px;background:var(--canvas);
  border:1px solid var(--line);border-left:5px solid #d99a86}
.risk-card.unknown-card{border-left-color:#a8b086;background:#f8f8ef}
.risk-title{margin:0 0 10px;font-size:16.5px;line-height:1.6;color:#5a3424}
.unknown-card .risk-title{color:#4a5230}

.risk-rows{display:grid;gap:6px;margin:0}
.risk-rows div{display:grid;grid-template-columns:8.5em minmax(0,1fr);gap:12px;padding-top:6px;border-top:1px solid #f0e5db}
.risk-rows dt{font-size:13.5px;font-weight:750;color:var(--clay);line-height:1.9}
.unknown-card .risk-rows dt{color:#58613b}
.risk-rows dd{margin:0;font-size:15.5px;line-height:1.85;color:#40342e;overflow-wrap:anywhere}

.risk-src{margin:12px 0 0;font-size:13.5px;line-height:1.8;color:var(--muted)}
.risk-src-label{font-weight:750;color:var(--clay)}
.risk-src a{color:var(--clay);text-underline-offset:3px;overflow-wrap:anywhere}
.risk-caveat{margin:10px 0 0;padding:8px 12px;border-radius:8px;background:#fbf3ea;
  font-size:13.5px;line-height:1.8;color:#5f5048}

.plain-list{margin:0;padding-left:1.3em}
.plain-list li{margin:0 0 6px;font-size:15.5px;line-height:1.85;color:#40342e}

.incident-note{margin:0 0 12px;padding:12px 16px;border-radius:10px;background:#fbeae1;
  border-left:5px solid #c0604a;font-size:15px;line-height:1.85;color:#5a3424}

/* ------------------------------------------------------------------ 相談 */
.field-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:4px 20px;margin:0}
.field{margin:0 0 16px}
.field label{display:block;margin:0 0 6px;font-size:15px;font-weight:750;line-height:1.7;color:var(--clay)}
.field .opt{margin-left:6px;font-size:13px;font-weight:600;color:var(--muted)}
.field input[type="text"],.field input[type="email"],.field textarea{
  width:100%;padding:12px 14px;border-radius:10px;border:1px solid var(--line);background:var(--paper);
  color:var(--ink);font-family:inherit;font-size:16px;line-height:1.7}
.field input:focus-visible,.field textarea:focus-visible{outline:3px solid var(--clay);outline-offset:2px}
.field textarea{resize:vertical;min-height:110px}

.check-attach label{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--ink)}
.check-attach input{width:20px;height:20px;margin:0;accent-color:var(--clay)}
.check-attach input:focus-visible{outline:3px solid var(--clay);outline-offset:3px}

.privacy-note{margin:4px 0 18px;padding:14px 18px;border-radius:12px;background:#fbeae1;border:1px solid #e0b3a3}
.privacy-note h3{margin:0 0 6px;font-size:15.5px;line-height:1.6;color:#6b3626}
.privacy-note ul{margin:0;padding-left:1.3em}
.privacy-note li{font-size:15px;line-height:1.8;color:#5a3424}

#preview-area{margin:24px 0 0}
#preview-area h3{margin:0 0 8px;font-size:17px;line-height:1.6;color:var(--clay)}
.preview-note{margin:0 0 8px;font-size:14.5px;line-height:1.8;color:#58613b;min-height:1.8em}
.preview-box{margin:0;padding:18px 20px;border-radius:12px;background:var(--paper);border:1px solid var(--line);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Hiragino Sans",monospace;
  font-size:14px;line-height:1.9;color:#40342e;white-space:pre-wrap;overflow-wrap:anywhere;max-height:460px;overflow:auto}
.preview-box:focus-visible{outline:3px solid var(--clay);outline-offset:2px}
.preview-foot{margin:10px 0 0;font-size:14px;line-height:1.85;color:var(--muted)}

/* ------------------------------------------------------------------ 画面幅 */
@media (max-width:760px){
  .q-help,.q-na-note,.q-options{padding-left:0}
  .q-legend{gap:10px}
  .q-text{font-size:16px}
  .q-options{grid-template-columns:1fr}
  .risk-rows div{grid-template-columns:1fr;gap:2px}
  .risk-rows dt{padding-top:4px}
  .form-actions .btn-primary,.form-actions .btn-quiet{width:100%}
}

@media (max-width:380px){
  .proto-banner,.scope-note,.result-section,.nojs-note{padding-left:14px;padding-right:14px}
  .q-fieldset{padding:14px 14px}
  .risk-card{padding:14px}
  .preview-box{padding:14px;font-size:13px}
  .q-num{min-width:42px}
  .q-text{font-size:15.5px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}

/* ================================================================== v3 追加 */
.self-report-note{margin:16px 0 0;padding:12px 16px;border-radius:12px;background:var(--cream);
  border:1px solid #e3b48f;border-left:6px solid #c07a4e;font-size:15px;line-height:1.85;color:#5a3424}
.self-report-note strong{color:#6b3626}

/* 結果の要約一覧（短い一覧を先に） */
.summary-box{margin:20px 0 0;padding:20px;border-radius:14px;background:var(--paper);border:2px solid #e3b48f}
.summary-box h3{margin:0 0 6px;font-size:18px;line-height:1.6;color:var(--clay)}
.summary-lead{margin:0 0 12px;font-size:15px;line-height:1.85;color:#4d3d35}
.summary-group{margin:12px 0 0}
.summary-group-title{margin:0 0 6px;font-size:15px;line-height:1.6;font-weight:800;color:#5a3424}
.summary-list{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.summary-list li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;padding:8px 12px;border-radius:10px;background:var(--canvas);border:1px solid var(--line);font-size:15px;line-height:1.75}
.summary-tag{display:inline-block;white-space:nowrap;padding:0 8px;border-radius:6px;font-size:12.5px;font-weight:800;line-height:1.9}
.summary-tag.no{background:#f3e0d6;color:#7a3a28}
.summary-tag.unknown{background:#e9ecd8;color:#4a5230}
.summary-list a{color:var(--ink);text-underline-offset:3px}
.summary-list small{display:block;color:var(--muted);font-size:13.5px}
.summary-none{margin:0;font-size:15px;line-height:1.85;color:#4d3d35}
.summary-actions{display:flex;flex-wrap:wrap;gap:10px 12px;margin:16px 0 0}

/* 詳細の開閉 */
.risk-details{margin:12px 0 0;border-radius:12px;border:1px solid var(--line);background:var(--canvas);scroll-margin-top:calc(var(--header-h) + 16px)}
.risk-details>summary{display:flex;align-items:center;gap:10px;min-height:48px;padding:10px 16px;cursor:pointer;list-style:none;font-size:15.5px;font-weight:750;line-height:1.6;color:#5a3424}
.risk-details>summary::-webkit-details-marker{display:none}
.risk-details>summary::before{content:"＋";flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#f5e3d6;font-size:13px}
.risk-details[open]>summary::before{content:"−"}
.risk-details>summary:focus-visible{outline:3px solid var(--clay);outline-offset:2px}
.risk-details .risk-card{margin:0;border-radius:0 0 12px 12px;border-width:1px 0 0 5px}
.risk-details.unknown>summary{color:#4a5230}

/* 相談フォーム */
.req{margin-left:6px;font-size:12.5px;font-weight:800;color:#7a3a28}
.field-hint{margin:6px 0 0;font-size:13.5px;line-height:1.75;color:var(--muted)}
.policy-box{margin:4px 0 18px;padding:16px 20px;border-radius:12px;background:var(--paper);border:1px solid var(--line)}
.policy-box h3{margin:0 0 8px;font-size:16px;line-height:1.6;color:var(--clay)}
.policy-box dl{margin:0;display:grid;gap:0}
.policy-box dl div{display:grid;grid-template-columns:9em minmax(0,1fr);gap:12px;padding:8px 0;border-top:1px solid #f0e5db}
.policy-box dt{font-size:13.5px;font-weight:800;color:var(--clay);line-height:1.85}
.policy-box dd{margin:0;font-size:14.5px;line-height:1.85;color:#40342e;overflow-wrap:anywhere}
.fee-note{margin:0 0 18px;padding:12px 16px;border-radius:10px;background:#f2f3e7;border:1px solid #dfe3c8;font-size:14.5px;line-height:1.85;color:#40342e}
.consent-row label{display:flex;align-items:flex-start;gap:10px;font-weight:700;color:var(--ink);line-height:1.7}
.consent-row input{flex:none;width:20px;height:20px;margin:3px 0 0;accent-color:var(--clay)}
.consent-row input:focus-visible{outline:3px solid var(--clay);outline-offset:3px}
.hp-field{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.btn-primary[disabled]{background:#b9a79d;cursor:not-allowed}
.send-status{margin:14px 0 0;padding:0;font-size:15px;line-height:1.85;font-weight:700}
.send-status:empty{display:none}
.send-status.is-sending{padding:12px 16px;border-radius:10px;background:var(--cream);color:#5a3424}
.send-status.is-ok{padding:12px 16px;border-radius:10px;background:#e3ead0;color:#3f4a23;border-left:5px solid #7f8c4f}
.send-status.is-error{padding:12px 16px;border-radius:10px;background:#fbeae1;color:#6b3626;border-left:5px solid #c0604a}
.field-error{margin:6px 0 0;font-size:13.5px;font-weight:700;color:#7a3a28}
.field-error:empty{display:none}

@media (max-width:760px){
  .policy-box dl div{grid-template-columns:1fr;gap:0}
  .summary-actions .btn-primary,.summary-actions .btn-quiet{width:100%}
}
