.jf--website-widget-tools[data-tool] .jf--ww-checker { color: #0a1551; font-size: 14px; line-height: 20px; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-workspace { position: relative; grid-template-columns: minmax(0, 480fr) minmax(0, 572fr); }
.jf--website-widget-tools[data-tool] .jf--ww-checker-form { height: auto; }
.jf--ww-checker-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.jf--ww-checker-fields { display: flex; flex-direction: column; gap: 16px; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-label { display: block; margin: 0 0 4px; color: #0a1551; font-size: 14px; line-height: 20px; font-weight: 700; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-url-field { display: flex; align-items: center; gap: 12px; height: 40px; padding-right: 12px; overflow: hidden; border: 1px solid #c8ceed; border-radius: 4px; background: #fff; }
.jf--ww-checker-protocol { display: flex; align-items: center; align-self: stretch; flex-shrink: 0; padding-inline: 12px; background: #f3f3fe; color: #6c73a8; font-size: 14px; line-height: 20px; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-url { width: 100%; min-width: 0; height: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; color: #0a1551; background: transparent; font-size: 14px; line-height: 20px; outline: none; box-shadow: none; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-url:autofill { box-shadow: 0 0 0 1000px #fff inset; color: #0a1551; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-url:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #fff inset; -webkit-text-fill-color: #0a1551; caret-color: #0a1551; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-url:disabled { color: #6c73a8; cursor: wait; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-url-field:has(input:disabled) { background: #f3f3fe; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-url:disabled:autofill { box-shadow: 0 0 0 1000px #f3f3fe inset; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-url:disabled:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #f3f3fe inset; -webkit-text-fill-color: #6c73a8; }
.jf--website-widget-tools[data-tool] .jf--ww-checker :is(.jf--ww-checker-submit, .jf--ww-checker-cancel) { display: flex; align-items: center; justify-content: center; flex-shrink: 0; height: 40px; margin: 0; padding: 8px 12px; border: 0; border-radius: 4px; background: #0075e3; color: #fff; font-size: 14px; line-height: 20px; font-weight: 500; }
.jf--website-widget-tools[data-tool] .jf--ww-checker .jf--ww-checker-submit { width: 100%; margin-top: 24px; }
.jf--website-widget-tools[data-tool] .jf--ww-checker .jf--ww-checker-submit:hover { background: #0066c3; }
.jf--website-widget-tools[data-tool] .jf--ww-checker .jf--ww-checker-cancel { border: 1px solid #0075e3; background: #fff; color: #0075e3; }
.jf--website-widget-tools[data-tool] .jf--ww-checker .jf--ww-checker-cancel:hover { background: #edf8ff; }
.jf--website-widget-tools[data-tool] .jf--ww-checker :is(.jf--ww-checker-submit, .jf--ww-select-trigger):disabled { opacity: .65; cursor: wait; }
.jf--website-widget-tools[data-tool] .jf--ww-checker .jf--ww-checker-submit:disabled { cursor: not-allowed; opacity: .4; background: #0075e3; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-form[aria-busy='true'] .jf--ww-checker-submit:disabled { cursor: wait; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-error { margin-top: 8px; color: #c90909; font-size: 12px; line-height: 16px; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-result { height: auto; min-height: calc(var(--ww-height) - var(--ww-output-space) * 2); }
.jf--website-widget-tools[data-tool] .jf--ww-checker-result.is-generated { background: linear-gradient(147.641deg, #0075e3 0%, #0a1551 69.252%); color: #fff; }
.jf--ww-checker-placeholder { display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: center; gap: 16px; text-align: center; }
.jf--ww-checker-placeholder-icon { display: flex; color: #c8ceed; }
.jf--ww-checker-placeholder-icon svg { width: 56px; height: 56px; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-placeholder-description { margin-top: 4px; color: #6c73a8; font-size: 16px; line-height: 24px; }
.jf--ww-checker-summary { display: flex; flex: 1; flex-direction: column; min-height: 0; gap: 24px; }
.jf--ww-checker-overview { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; }
.jf--ww-checker-page-info { flex: 1; min-width: 160px; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-report-title { margin: 0 0 8px; color: #fff; font-size: 24px; line-height: 32px; font-weight: 700; letter-spacing: -.019em; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-page { color: #fff; font-size: 16px; line-height: 24px; font-weight: 500; overflow-wrap: anywhere; }
.jf--ww-checker-score-grade[data-rating='good'] { color: #cbfb7b; }
.jf--ww-checker-score-grade[data-rating='moderate'] { color: #ffda75; }
.jf--ww-checker-score-grade[data-rating='poor'] { color: #ffb8b8; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-description { margin-top: 4px; color: #e3e5f5; font-size: 12px; line-height: 16px; }
.jf--ww-checker-score-ring { --score: 0%; --score-color: #c8ceed; position: relative; flex-shrink: 0; width: 120px; height: 120px; padding: 8px; border-radius: 50%; }
.jf--ww-checker-score-ring::before { content: ''; position: absolute; inset: 0; border-radius: inherit; background: conic-gradient(var(--score-color) var(--score), rgb(255 255 255 / 18%) 0); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 7.5px)); mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 7.5px)); }
.jf--ww-checker-score-ring[data-rating='good'] { --score-color: #8fd835; }
.jf--ww-checker-score-ring[data-rating='moderate'] { --score-color: #ffbf32; }
.jf--ww-checker-score-ring[data-rating='poor'] { --score-color: #ff6b6b; }
.jf--ww-checker-score-inner { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-score { color: #fff; font-size: 40px; line-height: 48px; font-weight: 700; }
.jf--ww-checker-score-unit { color: #c8ceed; font-size: 12px; line-height: 16px; }
.jf--ww-checker-counts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.jf--ww-checker-count { --count-color: #8abaff; display: flex; align-items: center; gap: 8px; padding: 6px 12px; border: 1px solid rgb(255 255 255 / 28%); border-radius: 9999px; background: rgb(255 255 255 / 6%); color: #fff; font-size: 13px; line-height: 16px; }
.jf--ww-checker-count[data-tone='critical'] { --count-color: #ff6b6b; }
.jf--ww-checker-count[data-tone='serious'] { --count-color: #ff9a56; }
.jf--ww-checker-count[data-tone='moderate'] { --count-color: #ffcc47; }
.jf--ww-checker-count[data-tone='passed'] { --count-color: #8fd835; }
.jf--ww-checker-count-dot { flex-shrink: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--count-color); }
.jf--ww-checker-count-label { flex: 1; min-width: 0; color: rgb(255 255 255 / 85%); }
.jf--ww-checker-count-value { font-weight: 700; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-widget { margin-top: auto; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-report { display: grid; grid-template-rows: auto minmax(0, 1fr); height: 720px; margin-top: 12px; overflow: hidden; border-radius: 16px; background: #fff; }
.jf--ww-checker-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 16px 24px; border-bottom: 1px solid #e3e5f5; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-tab { --tab-color: #dc2626; --tab-background: #fff1f1; display: flex; align-items: center; gap: 8px; min-height: 40px; margin: 0; padding: 8px 10px 8px 14px; border: 1px solid #e3e5f5; border-radius: 9999px; background: #fff; color: var(--tab-color); font-size: 14px; line-height: 20px; font-weight: 500; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-tab[data-checker-tab='incomplete'] { --tab-color: #0075e3; --tab-background: #edf8ff; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-tab[data-checker-tab='passes'] { --tab-color: #447900; --tab-background: #edfed1; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-tab[aria-selected='true'] { border-color: var(--tab-color); background: var(--tab-background); }
.jf--ww-checker-tab-icon { display: flex; flex-shrink: 0; }
.jf--ww-checker-tab-icon svg { width: 16px; height: 16px; }
.jf--ww-checker-tab-count { display: flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding-inline: 6px; border-radius: 9999px; color: var(--tab-color); background: var(--tab-background); font-size: 12px; line-height: 16px; }
.jf--ww-checker-tab[aria-selected='true'] .jf--ww-checker-tab-count { color: #fff; background: var(--tab-color); }
.jf--website-widget-tools[data-tool] .jf--ww-checker-findings { min-height: 0; padding: 32px 24px 40px; overflow: auto; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-group-title { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; font-size: 18px; line-height: 24px; font-weight: 700; }
.jf--ww-checker-icon { display: flex; flex-shrink: 0; }
.jf--ww-checker-icon svg { width: 20px; height: 20px; }
.jf--ww-checker-issues { color: #c90909; }
.jf--ww-checker-passed { color: #447900; }
.jf--ww-checker-review { color: #0075e3; }
.jf--ww-checker-list { display: grid; gap: 12px; }
.jf--ww-checker-finding { overflow-wrap: anywhere; border: 1px solid #e3e6f2; border-radius: 12px; background: #fff; }
.jf--ww-checker-finding-heading { display: flex; align-items: center; gap: 14px; padding: 16px 20px; list-style: none; cursor: pointer; }
.jf--ww-checker-finding-heading::-webkit-details-marker { display: none; }
.jf--ww-checker-finding[open] > summary { border-radius: 12px 12px 0 0; background: #f9faff; }
.jf--ww-checker-finding[open] > summary > .jf--ww-checker-chevron { transform: rotate(180deg); }
.jf--ww-checker-finding-title { display: block; flex: 1; min-width: 0; }
.jf--ww-checker-rule-title { display: block; font-size: 15px; line-height: 22px; font-weight: 700; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-metadata { display: block; margin-top: 4px; color: #6c73a8; font-size: 12px; line-height: 16px; }
.jf--ww-checker-chevron { color: #6c73a8; }
.jf--ww-checker-chevron svg { width: 16px; height: 16px; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-finding-body { padding: 20px; border-top: 1px solid #e3e5f5; font-size: 15px; line-height: 22px; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-detail-label { color: #6c73a8; font-size: 13px; line-height: 18px; font-weight: 500; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-detail-next { margin-top: 24px; }
.jf--website-widget-tools[data-tool] :is(.jf--ww-checker-detail-text, .jf--ww-checker-fix) { margin-top: 8px; }
.jf--ww-checker-fix { white-space: pre-line; overflow-wrap: anywhere; }
.jf--ww-checker-badge { flex-shrink: 0; padding: 4px 8px; border-radius: 6px; background: #f3f3fe; color: #343c6a; font-size: 13px; line-height: 18px; font-weight: 500; }
.jf--ww-checker-badge[data-status='passed'] { background: #edf7e0; color: #3e7a00; }
.jf--ww-checker-badge:is([data-status='review'], [data-status='minor']) { background: #edf8ff; color: #0066c3; }
.jf--ww-checker-badge:is([data-status='critical'], [data-status='serious']) { background: #fff1f1; color: #c90909; }
.jf--ww-checker-badge[data-status='moderate'] { background: #fff4d7; color: #855500; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-review-note { margin-top: 16px; padding: 12px; border-radius: 4px; background: #fff4d7; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-guidance { margin-top: 12px; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-link { color: #0075e3; text-decoration: underline; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-evidence { margin-top: 16px; }
.jf--ww-checker-evidence-toggle { color: #0075e3; font-weight: 500; cursor: pointer; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-footnote { margin-top: 8px; color: #6c73a8; font-size: 12px; line-height: 16px; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-node { margin-top: 12px; padding: 16px; border: 1px solid #e3e5f5; border-radius: 8px; }
.jf--ww-checker-item-title { font-size: 14px; line-height: 20px; font-weight: 700; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-code { margin-top: 8px; padding: 12px; border-radius: 4px; background: #f9faff; font-family: monospace; font-size: 12px; line-height: 16px; white-space: pre-wrap; overflow-wrap: anywhere; direction: ltr; text-align: left; }
.jf--ww-checker-node p { white-space: pre-line; overflow-wrap: anywhere; }
.jf--website-widget-tools[data-tool] .jf--ww-checker-more-checks { margin: 16px 0 0; padding: 0; border: 0; background: transparent; color: #0075e3; font-size: 14px; line-height: 20px; font-weight: 500; text-align: start; }
.jf--ww-checker-workspace:has([aria-busy='true'])::before, .jf--ww-checker-workspace:has([aria-busy='true'])::after { content: ''; position: absolute; top: 0; left: 0; height: 4px; pointer-events: none; z-index: 1; }
.jf--ww-checker-workspace:has([aria-busy='true'])::before { width: 100%; background: #dcecff; }
.jf--ww-checker-workspace:has([aria-busy='true'])::after { width: 35%; background: #0075e3; animation: jf-ww-checker-progress 1.6s ease-in-out infinite; }
@keyframes jf-ww-checker-progress { from { transform: translateX(-100%); } to { transform: translateX(286%); } }
@media (prefers-reduced-motion: reduce) { .jf--ww-checker-workspace:has([aria-busy='true'])::after { animation: none; left: 32.5%; } }
/* Blog columns need more room than the full-width landing's hero. */
@container jf-ww-tool (max-width: 900px) {
  .jf--website-widget-tools[data-tool] .jf--ww-checker-workspace { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .jf--website-widget-tools[data-tool] .jf--ww-checker-workspace .jf--ww-form { height: auto; min-height: 0; padding: 24px; }
  .jf--website-widget-tools[data-tool] .jf--ww-checker-workspace .jf--ww-output { padding: 0; }
  .jf--website-widget-tools[data-tool] .jf--ww-checker-workspace .jf--ww-result-panel { height: auto; min-height: 0; padding: 24px; border-radius: 0 0 12px 12px; }
}

.jf--website-widget-tools[data-tool] .jf--ww-checker-workspace:has(> [data-part='output'][hidden]) { grid-template-columns: minmax(0, 1fr); }