body { font-family: system-ui, sans-serif; margin: 0; color: #222; background: #fff; }
main { max-width: 40rem; margin: 20vh auto 0; padding: 0 1rem; text-align: center; }
.site-header { padding: 1rem; border-bottom: 1px solid #ddd; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.site-nav { display: flex; align-items: center; gap: 1rem; font-size: .9rem; }
.inline-form { display: inline; margin: 0; }
.link-button { background: none; border: 0; padding: 0; font: inherit; color: #1565c0; text-decoration: underline; cursor: pointer; }
.site-header a { color: inherit; font-weight: bold; text-decoration: none; }
.site-footer { padding: 2rem 1rem; text-align: center; font-size: .85rem; color: #555; }
main { text-align: left; margin-top: 5vh; }
.lead { color: #555; }
.scan-form { display: grid; gap: .75rem; margin: 1.5rem 0; }
/* 入力欄はフォームの幅いっぱいに広げる（文字・メール・日時・選択・複数行すべて共通） */
.scan-form input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]),
.scan-form select,
.scan-form textarea { width: 100%; box-sizing: border-box; padding: .65rem .75rem; font: inherit; font-size: 1rem; color: inherit; background: #fff; border: 1px solid #aaa; border-radius: .35rem; }
.scan-form textarea { min-height: 5rem; resize: vertical; }
.scan-form input:focus, .scan-form select:focus, .scan-form textarea:focus { outline: 2px solid #1565c0; outline-offset: 1px; border-color: #1565c0; }
.scan-form label { font-weight: 600; }
.scan-form label.agree, .scan-form label.check-option, .scan-form fieldset label { font-weight: normal; }
.scan-form button { padding: .75rem; font-size: 1rem; font-weight: 600; cursor: pointer; color: #fff; background: #1565c0; border: 1px solid #0d47a1; border-radius: .35rem; }
.scan-form button:hover { background: #0d47a1; }
.scan-form button:focus-visible { outline: 2px solid #1565c0; outline-offset: 2px; }
.error { color: #b00020; }
.note { font-size: .85rem; color: #555; }
.target { word-break: break-all; font-weight: bold; }
.checks { border-collapse: collapse; width: 100%; }
.checks th, .checks td { border: 1px solid #ddd; padding: .5rem; text-align: left; vertical-align: top; }
progress { width: 100%; }
.site-header img { display: block; height: 36px; width: auto; }

/* 結果画面 */
.scores, .attention, .category { margin: 1.75rem 0; }
.score-list { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr)); gap: .75rem; }
.score { border: 2px solid #bbb; border-radius: .5rem; padding: .75rem; display: grid; gap: .15rem; text-align: center; }
.score-label { font-size: .85rem; color: #333; }
.score-value { font-size: 2rem; font-weight: bold; line-height: 1.1; }
.score-signal { font-size: .85rem; font-weight: bold; }
.score-green { border-color: #2e7d32; background: #f1f8f1; }
.score-yellow { border-color: #b26a00; background: #fff8e8; }
.score-red { border-color: #b00020; background: #fdf0f2; }
.score-gray { border-color: #999; background: #f5f5f5; }
.score-extra { font-size: .95rem; }
.score-inline { font-size: .9rem; font-weight: normal; margin-left: .5rem; color: #555; }
.check { border: 1px solid #ddd; border-left-width: .4rem; border-radius: .4rem; padding: .75rem 1rem; margin: .75rem 0; }
.check h3 { margin: 0 0 .4rem; font-size: 1.05rem; }
.check-title { margin: .25rem 0; font-weight: bold; overflow-wrap: anywhere; }
.status-critical { border-left-color: #b00020; }
.status-warn { border-left-color: #b26a00; }
.status-info { border-left-color: #1565c0; }
.status-ok { border-left-color: #2e7d32; }
.status-error, .status-skipped { border-left-color: #999; }
.badge { display: inline-block; font-size: .75rem; font-weight: bold; padding: .1rem .5rem; border-radius: 1rem; border: 1px solid currentColor; vertical-align: middle; }
.badge-critical { color: #b00020; }
.badge-warn { color: #8a5200; }
.badge-info { color: #1565c0; }
.badge-ok { color: #2e7d32; }
.badge-error, .badge-skipped { color: #666; }
.meta { display: grid; grid-template-columns: max-content 1fr; gap: .1rem .75rem; margin: .5rem 0; font-size: .9rem; }
.meta dt { color: #555; }
.meta dd { margin: 0; }
.what, .fix { margin: .5rem 0; overflow-wrap: anywhere; }
.evidence { margin: .5rem 0; font-size: .85rem; }
.evidence table { border-collapse: collapse; width: 100%; }
.evidence th, .evidence td { border: 1px solid #ddd; padding: .3rem .5rem; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.evidence th { width: 30%; font-weight: normal; color: #555; }
.attention ul { padding-left: 1.2rem; }
.attention li { margin: .35rem 0; overflow-wrap: anywhere; }
.button-link { display: inline-block; padding: .5rem .9rem; border: 1px solid #1565c0; border-radius: .3rem; color: #1565c0; text-decoration: none; background: #fff; font-size: .95rem; cursor: pointer; }
.copy-box { white-space: pre-wrap; overflow-wrap: anywhere; border: 1px solid #ddd; background: #fafafa; padding: .75rem; border-radius: .3rem; font-family: inherit; }
.actions { margin: 2rem 0; }
@media (max-width: 30rem) { main { margin-top: 2vh; } }

.notice { color: #1b5e20; background: #f1f8f1; border: 1px solid #2e7d32; border-radius: .3rem; padding: .5rem .75rem; }
fieldset { border: 1px solid #ddd; border-radius: .3rem; }
code { overflow-wrap: anywhere; }

.owner-cta { margin: 2rem 0; padding: 1rem; border: 1px solid #ddd; border-radius: .4rem; background: #fafafa; }
.owner-cta h2 { margin-top: 0; font-size: 1.1rem; }
.scope-list { border: 1px solid #ddd; border-radius: .3rem; padding: .5rem .75rem; margin: .75rem 0; }
.scope-list .check-option { display: block; margin: .25rem 0; font-weight: normal; }