.tool { max-width: 820px; margin: 0 auto; padding: 40px 20px 80px; }
.tool-eyebrow { display:inline-block; font-size:.78rem; letter-spacing:.08em; color:#0a7; background:#e6f7f1; padding:4px 12px; border-radius:999px; font-weight:700; }
.tool-title { font-size:2rem; margin:.4em 0 .3em; font-weight:900; }
.tool-lead { color:#555; line-height:1.8; margin:0 0 2em; }
.tool-questions { display:grid; gap:14px; background:#f7f9fb; border:1px solid #e7ecf1; border-radius:14px; padding:20px; margin-bottom:28px; }
.q { border:0; margin:0; padding:0; }
.q legend { font-weight:700; font-size:.95rem; margin-bottom:4px; padding:0; }
.q-help { font-size:.8rem; color:#88909a; line-height:1.6; margin:0 0 8px; }
.q-help a { color:#077; text-decoration:none; border-bottom:1px solid #bde3d6; white-space:nowrap; }
.q-help a:hover { background:#e6f7f1; }
.q-options { display:flex; flex-wrap:wrap; gap:8px; }
.q-options label { display:inline-flex; align-items:center; gap:6px; border:1.5px solid #d4dbe2; background:#fff; border-radius:10px; padding:8px 14px; cursor:pointer; font-size:.9rem; transition:.15s; }
.q-options label:hover { border-color:#0a7; }
.q-options input { accent-color:#0a7; }
.q-options input:checked + span { font-weight:700; color:#077; }
.q-options label:has(input:checked) { border-color:#0a7; background:#e6f7f1; }
.tool-progress { margin-bottom:24px; }
.tool-progress-bar { height:10px; background:#eef1f4; border-radius:999px; overflow:hidden; }
.tool-progress-bar span { display:block; height:100%; width:0; background:linear-gradient(90deg,#0a7,#3cc); transition:width .3s; }
#progressText { font-size:.88rem; color:#555; margin:8px 2px 0; font-weight:700; }
.tool-group-label { font-size:.85rem; font-weight:800; color:#888; margin:22px 2px 10px; letter-spacing:.03em; }
.step { display:flex; gap:14px; border:1.5px solid #e7ecf1; border-radius:14px; padding:16px 18px; margin-bottom:10px; background:#fff; transition:.15s; }
.step.checked { border-color:#0a7; background:#f3fbf8; }
.step.muted { opacity:.45; background:#fafbfc; }
.step.muted .step-body { pointer-events:none; }
.step-check { flex:0 0 auto; padding-top:2px; }
.step-check input { width:22px; height:22px; accent-color:#0a7; cursor:pointer; }
.step-body { flex:1; min-width:0; }
.step-task { font-weight:800; font-size:1.02rem; }
.step.checked .step-task { text-decoration:line-through; color:#0a7; }
.step-deadline { display:inline-block; font-size:.72rem; color:#c0392b; background:#fdecec; border-radius:6px; padding:2px 8px; margin-left:8px; font-weight:700; }
.step-desc { color:#666; font-size:.88rem; margin:4px 0 8px; line-height:1.7; }
.step-links { font-size:.82rem; margin:0 0 8px; }
.step-links a { color:#077; text-decoration:none; border-bottom:1px solid #bde3d6; }
.step-links a:hover { background:#e6f7f1; }
.step-box { font-size:.82rem; border-radius:10px; padding:8px 12px; margin-top:6px; }
.step-box.pr { background:#fff6e9; border:1px solid #ffe0b2; color:#a86a00; }
.step-box.pro { background:#eef4ff; border:1px solid #cfe0ff; color:#345; }
.step-box.note { background:#f4f6f8; border:1px solid #e3e8ee; color:#567; }
.step-box.judge { background:#f3f0ff; border:1px solid #ddd3ff; color:#634; }
.step-muted-tag { font-size:.74rem; color:#999; font-weight:700; margin-left:8px; }
.tool-done { text-align:center; background:linear-gradient(135deg,#e6f7f1,#eafaf4); border:1.5px solid #9fe0c9; border-radius:16px; padding:32px 20px; margin-top:24px; }
.tool-done h2 { margin:0 0 8px; }
.tool-done p { color:#477; margin:0; }
.tool-save-note { font-size:.78rem; color:#8a9; margin:6px 2px 0; }
.tool-disclaimer { font-size:.78rem; line-height:1.8; color:#8a93a0; background:#f7f9fb; border:1px solid #e7ecf1; border-radius:10px; padding:12px 14px; margin:24px 0 0; }
.tool-reset { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:28px; flex-wrap:wrap; }
.tool-reset-actions { display:flex; gap:10px; flex-wrap:wrap; }
.tool-back { color:#888; text-decoration:none; font-size:.85rem; }
.tool-back:hover { color:#0a7; }
.tool-reset button { background:none; border:1px solid #ccc; color:#888; border-radius:8px; padding:8px 18px; cursor:pointer; font-size:.85rem; }
.tool-reset button:hover { border-color:#999; color:#555; }
#printBtn { border-color:#9fe0c9; color:#0a7; }
#printBtn:hover { border-color:#0a7; color:#097; }
.pr-badge { display:inline-block; font-size:.66rem; font-weight:700; color:#a86a00; background:#ffe9c7; border-radius:5px; padding:1px 6px; vertical-align:middle; }

/* 印刷／PDF保存：質問・ナビ・実行ボックス・関係ないステップを隠し、ToDoだけ残す */
@media print {
    .header, .footer, .back-to-top, .tool-eyebrow, .tool-questions,
    .tool-progress, .tool-save-note, .tool-reset, .step-box, .step-links,
    .step.muted, .step-muted-tag { display: none !important; }
    body { background: #fff; }
    .tool { padding: 0; max-width: none; }
    .step { break-inside: avoid; border: 1px solid #999; }
    .step-check input { width: 18px; height: 18px; }
    .tool-done { border-color: #999; }
}
/* 一覧ハブ */
.goal-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:14px; }
.goal-card { display:flex; flex-direction:column; gap:6px; border:1.5px solid #e7ecf1; border-radius:14px; padding:20px; background:#fff; text-decoration:none; transition:.15s; }
.goal-card:hover { border-color:#0a7; background:#f3fbf8; transform:translateY(-2px); }
.goal-card-name { font-weight:800; font-size:1.05rem; color:#222; }
.goal-card-meta { font-size:.8rem; color:#999; }
.goal-card--soon { display:flex; align-items:center; justify-content:center; color:#aab; font-weight:700; font-size:.9rem; border-style:dashed; background:#fafbfc; }
.goal-card--soon:hover { transform:none; border-color:#dde; background:#fafbfc; }
/* トップの攻略チャート節 */
.tools-lead { text-align:center; color:#555; line-height:1.9; max-width:640px; margin:0 auto 28px; }
.how-steps { list-style:none; display:flex; flex-wrap:wrap; gap:12px; justify-content:center; padding:0; margin:32px 0 0; }
.how-steps li { display:flex; align-items:center; gap:10px; font-weight:700; font-size:.9rem; color:#456; background:#fff; border:1px solid #e7ecf1; border-radius:999px; padding:8px 18px 8px 8px; }
.how-step-no { display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; background:linear-gradient(135deg,#0a7,#3cc); color:#fff; font-size:.85rem; }
/* 記事末 → 攻略チャート 送客CTA */
.article-tool-cta { border:2px solid #9fe0c9; background:linear-gradient(135deg,#e6f7f1,#eafaf4); border-radius:16px; padding:24px 22px; margin:36px 0; }
.article-tool-cta h3 { margin:0 0 8px; font-size:1.12rem; }
.article-tool-cta p { margin:0 0 16px; font-size:.9rem; color:#3c6b5c; line-height:1.8; }
.tool-cta-btns { display:flex; flex-wrap:wrap; gap:10px; }
.tool-cta-btns a { display:inline-flex; align-items:center; gap:6px; background:#0a7; color:#fff; text-decoration:none; font-weight:700; font-size:.92rem; padding:11px 20px; border-radius:10px; transition:.15s; }
.tool-cta-btns a:hover { background:#097; transform:translateY(-1px); }