:root{color-scheme:light;--bg:#fff;--surface:#f6f9fc;--blue-soft:#eef7ff;--ink:#17233c;--muted:#5c6b82;--primary:#1769d2;--primary-dark:#0b4fa8;--cyan:#21b9cf;--line:#d9e2ec;--focus:#0b65c2;--good:#19734a;--warn:#8a5b00;--bad:#b32d3f;--shadow:0 10px 28px rgba(19,50,91,.08)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Hiragino Sans","Yu Gothic",sans-serif;line-height:1.75}
header,main,footer{width:min(100% - 40px,960px);margin:auto}
header{padding:40px 0 28px;border-bottom:1px solid var(--line)}
header small{color:var(--primary);font-weight:700;letter-spacing:.1em}
h1,h2,h3{line-height:1.45;letter-spacing:.01em}
h1{margin:.35rem 0;font-size:clamp(2rem,7vw,3.5rem)}
h2{font-size:1.6rem}
main{padding:36px 0 80px}
.intro{max-width:48rem;color:var(--muted)}
.flow{display:flex;gap:8px;flex-wrap:wrap;padding:0;margin:28px 0;list-style:none}
.flow li{display:flex;align-items:center;padding:5px 10px;border-radius:999px;background:var(--blue-soft);color:var(--primary-dark);font-size:.82rem;font-weight:700}
.flow li:not(:last-child)::after{content:"→";padding-left:10px;color:var(--cyan)}
form{margin-top:32px}
.group{padding:28px 0;border-top:1px solid var(--line)}
.group:last-of-type{border-bottom:1px solid var(--line)}
.group h2{margin-top:0}
.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
label{display:grid;gap:7px;font-weight:700}
label span{font-size:.86rem;color:var(--muted);font-weight:400}
input,select,textarea{width:100%;min-height:48px;padding:10px 12px;border:1px solid #b9c8d8;border-radius:8px;background:#fff;color:var(--ink);font:inherit}
textarea{min-height:100px;resize:vertical}
input:hover,select:hover,textarea:hover{border-color:#7f9bb9}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.wide{grid-column:1/-1}
.checks{display:grid;gap:10px}
.checks label{display:flex;align-items:flex-start;gap:10px;font-weight:400}
.checks input{width:22px;min-height:22px;margin-top:3px;accent-color:var(--primary)}
.actions{display:flex;gap:12px;margin:28px 0}
.button{min-height:50px;padding:11px 21px;border:1px solid var(--primary);border-radius:8px;background:var(--primary);color:#fff;font:700 1rem inherit;cursor:pointer;transition:background-color .2s,border-color .2s,transform .2s}
.button:hover{border-color:var(--primary-dark);background:var(--primary-dark);transform:translateY(-1px)}
.button.secondary{background:#fff;color:var(--primary)}
.button.secondary:hover{background:var(--blue-soft);color:var(--primary-dark)}
.button:disabled{opacity:.5;cursor:not-allowed;transform:none}
.result{margin-top:44px;padding-top:34px;border-top:4px solid var(--primary)}
.result[hidden]{display:none}
.status{padding:22px;border:1px solid var(--line);border-left:5px solid var(--warn);border-radius:8px;background:var(--surface)}
.status.good{border-left-color:var(--good)}
.status.bad{border-left-color:var(--bad)}
.status h2{margin:0 0 6px}
.status p{margin:0}
.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:30px 0}
.result-section{border-top:1px solid var(--line);padding-top:18px}
.result-section h3{margin-top:0}
.result-section li{margin:.6rem 0}
.priority-list{counter-reset:p;padding:0;list-style:none}
.priority-list li{counter-increment:p;padding:15px 0;border-bottom:1px solid var(--line)}
.priority-list li::before{content:"優先度 " counter(p);display:block;color:var(--primary);font-size:.75rem;font-weight:700}
.metric-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line);margin:28px 0;background:#fff}
.metric{padding:20px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.metric span{display:block;color:var(--muted);font-size:.82rem}
.metric strong{font-size:1.6rem;color:var(--primary-dark)}
.reason{margin:22px 0}
.reason details{border-top:1px solid var(--line);padding:16px 0}
.reason details:last-child{border-bottom:1px solid var(--line)}
summary{cursor:pointer;font-weight:700}
.disclaimer{margin-top:32px;padding:18px;border-radius:8px;background:var(--blue-soft);color:var(--muted);font-size:.88rem}
.channel-fit{margin-top:20px}.result-disclaimer strong{color:var(--ink)}.result-disclaimer p{margin:.45rem 0 0}.tool-related{margin-top:40px}.tool-related a{color:var(--primary);font-weight:700;text-underline-offset:.2em}
footer{padding:26px 0;border-top:1px solid var(--line);color:var(--muted);font-size:.8rem}
@media(max-width:680px){.fields,.result-grid,.metric-grid{grid-template-columns:1fr}.wide{grid-column:auto}.actions{flex-direction:column}.button{width:100%}header,main,footer{width:min(100% - 28px,960px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}
