/*!
 * wsc-tools components on top of the theme's tool styles (DESIGN.md amendment 11, spec 4.2).
 * Tokens only. The three score colours are the token request in DESIGN.md amendment 12; until brand-kit-builder
 * adds them they fall back to the status tokens.
 */
.wsc-tool-root{display:contents}
:root{
	--wsc-score-low:var(--color-score-low,var(--color-error));
	--wsc-score-mid:var(--color-score-mid,var(--color-warning));
	--wsc-score-high:var(--color-score-high,var(--color-success));
}

/* ------------------------------------------------------------ result slot */
.result-slot[aria-busy=true]{min-block-size:320px}
.result-slot:focus-within,.wsc-result:focus{outline:none}
.wsc-result:focus-visible,.wsc-error:focus-visible,.wsc-done:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}
.wsc-hp{position:absolute!important;inset-inline-start:-9999px;inline-size:1px;block-size:1px;overflow:hidden}
.tool-input .wsc-err,.tool-input .wsc-extra{grid-column:1/-1}
.wsc-err{color:var(--color-error);font-weight:var(--weight-medium)}
.wsc-err[hidden]{display:none}
.field [aria-invalid=true]{border-color:var(--color-error)}
.wsc-linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--color-brand-deep);text-decoration:underline;text-underline-offset:.2em;cursor:pointer;min-block-size:44px}
.wsc-linkbtn:hover{color:var(--color-brand-hover)}

/* --------------------------------------------------------------- progress */
.wsc-progress{margin-block-start:var(--space-6);padding:var(--space-5);border:1px solid var(--color-line-strong);border-radius:var(--card-radius);display:grid;gap:var(--space-4)}
.wsc-progress__steps{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-2);grid-template-columns:repeat(4,minmax(0,1fr));font-size:var(--text-sm)}
.wsc-progress__steps li{color:var(--color-ink-muted);padding-block-start:var(--space-2);border-block-start:3px solid var(--color-line)}
.wsc-progress__steps li.is-done{color:var(--color-ink);border-color:var(--color-brand)}
.wsc-progress__steps li.is-active{color:var(--color-ink);font-weight:var(--weight-medium);border-color:var(--color-secondary)}
.wsc-progress__bar{block-size:6px;border-radius:999px;background:var(--color-line);overflow:hidden}
.wsc-progress__bar span{display:block;block-size:100%;inline-size:12%;background:var(--color-brand);border-radius:inherit}
@media (prefers-reduced-motion:no-preference){
	.wsc-progress__bar span{transition:inline-size .6s var(--ease-standard,ease)}
	.wsc-progress__steps li.is-active{animation:wsc-pulse 1.6s ease-in-out infinite}
}
@keyframes wsc-pulse{50%{opacity:.6}}
@media (max-width:767px){
	.wsc-progress__steps{grid-template-columns:1fr}
	.wsc-progress__steps li{border-block-start:0;border-inline-start:3px solid var(--color-line);padding-block-start:0;padding-inline-start:var(--space-3)}
	.wsc-progress__steps li:not(.is-active){display:none}
}
.wsc-runlead{margin-block-start:var(--space-4)}

/* ------------------------------------------------------------------ gauge */
.gauge .gauge__fill{stroke:var(--color-brand)}
.gauge.is-low .gauge__fill{stroke:var(--wsc-score-low)}
.gauge.is-mid .gauge__fill{stroke:var(--wsc-score-mid)}
.gauge.is-high .gauge__fill{stroke:var(--wsc-score-high)}
.gauges--one{grid-template-columns:1fr!important;justify-items:center}
.gauge--grade .gauge__value{font-size:var(--text-4xl,3rem)}
@media (prefers-reduced-motion:no-preference){.gauge__fill{transition:stroke-dashoffset .9s var(--ease-standard,ease)}}

/* status dots with text alternatives (theme .status is neutral) */
.status.is-good{background:var(--wsc-score-high)}
.status.is-mid{background:var(--wsc-score-mid)}
.status.is-bad{background:var(--wsc-score-low)}
.status.is-info{background:var(--color-brand)}
.status{flex:none;margin-block-start:.5em}

.wsc-tag{display:inline-block;margin-inline-start:var(--space-2);padding:0 var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--weight-medium);border:1px solid var(--color-line-strong);color:var(--color-ink-muted);vertical-align:middle}
.wsc-tag.is-bad{border-color:var(--wsc-score-low);color:var(--color-error)}

.wsc-more summary{cursor:pointer;list-style:none}
.wsc-more summary::-webkit-details-marker{display:none}
.wsc-more[open] summary{margin-block-end:var(--space-2)}

.wsc-sentence{margin:0}
.wsc-note{padding:var(--space-3) var(--space-4);border-inline-start:3px solid var(--color-brand);background:var(--color-brand-tint);border-radius:var(--radius-sm)}

/* checklist (AI readiness) */
.wsc-checklist{list-style:none;margin:0;padding:0;display:grid;gap:0}
.wsc-checklist li{display:grid;grid-template-columns:auto 1fr;gap:var(--space-3);align-items:start;padding-block:var(--space-3);border-block-end:1px solid var(--color-line)}
.wsc-checklist__label{font-weight:var(--weight-medium)}
@media (min-width:768px){.wsc-checklist{grid-template-columns:1fr 1fr;column-gap:var(--space-6)}}

/* stats (accessibility, broken links) */
.wsc-stats{display:grid;gap:var(--space-3);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:768px){.wsc-stats{grid-template-columns:repeat(4,minmax(0,1fr))}}
.wsc-stat{display:grid;gap:var(--space-1);padding:var(--space-4);border:var(--card-border,1px solid var(--color-line));border-radius:var(--radius-sm);border-block-start:4px solid var(--color-line-strong)}
.wsc-stat.is-bad{border-block-start-color:var(--wsc-score-low)}
.wsc-stat.is-mid{border-block-start-color:var(--wsc-score-mid)}
.wsc-stat.is-good{border-block-start-color:var(--wsc-score-high)}
.wsc-stat__v{font-size:var(--text-3xl);font-weight:var(--weight-display);line-height:1;font-variant-numeric:tabular-nums}

.wsc-ctas{--gap:var(--space-3)}
.wsc-done .subtitle{display:flex;gap:var(--space-2);align-items:baseline}
.wsc-error .lead-form{margin-block-start:var(--space-3)}
.wsc-captcha-note{margin:0}

/* ------------------------------------------------------------ which plan */
.wp-engine{display:grid;gap:var(--space-4)}
.wp-engine--page{margin-block-start:var(--space-2)}
.wp-step{display:grid;gap:var(--space-4)}
.wp-step fieldset{border:0;padding:0;margin:0;display:grid;gap:var(--space-2)}
.wp-step legend{display:grid;gap:var(--space-1);margin-block-end:var(--space-2);padding:0}
.wp-step legend:focus{outline:none}
.wp-step legend:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}
.wp-q{font-size:var(--text-xl);font-weight:var(--weight-medium);line-height:1.35}
.wp-step label{display:flex;align-items:center;gap:var(--space-3);min-block-size:48px;padding-inline:var(--space-3);border:1px solid var(--color-line);border-radius:var(--radius-sm);cursor:pointer;background:var(--color-surface)}
.wp-step label:hover{border-color:var(--color-line-strong)}
.wp-step label:has(input:checked){border-color:var(--color-brand-deep);background:var(--color-brand-tint)}
.wp-step input[type=radio]{inline-size:20px;block-size:20px;accent-color:var(--color-brand-deep)}
.wp-step .btn{justify-self:start}
.wp-history{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--space-1) var(--space-2);font-size:var(--text-sm)}
.wp-history li{display:flex;align-items:center;gap:var(--space-2)}
.wp-history li+li::before{content:"›";color:var(--color-ink-muted)}
.wp-history .wsc-linkbtn{min-block-size:32px}
.wp-plan{display:grid;gap:var(--space-3)}
.wp-plan__name{margin:0;font-size:var(--text-2xl);font-weight:var(--weight-display);line-height:1.25}
.wp-plan ul{margin:0;padding-inline-start:var(--space-5);display:grid;gap:var(--space-1)}
.wp-why{display:grid;gap:var(--space-2)}
.wp-answers summary{cursor:pointer;color:var(--color-brand-deep)}
.wp-answers ol{margin-block-start:var(--space-2);padding-inline-start:var(--space-5)}
/* real test email (1.4.0) */
.wsc-mailtest{display:grid;gap:var(--space-3);margin-block-start:var(--space-6);padding:var(--space-5);border:1px dashed var(--color-brand);border-radius:var(--radius-md,8px);background:var(--color-brand-tint)}
.wsc-mailtest .subtitle{margin:0}
.wsc-mailtest ul{display:grid;gap:var(--space-2);margin:0;padding-inline-start:1.2em}
.wsc-mailtest__addr{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3);margin:0}
.wsc-mailtest__addr bdi{font-family:var(--font-utility,monospace);font-size:var(--text-lg);padding:var(--space-2) var(--space-3);background:var(--color-surface);border:1px solid var(--color-line-strong);border-radius:var(--radius-sm,4px);overflow-wrap:anywhere}
.wsc-mailtest__wait::before{content:"";display:inline-block;inline-size:.7em;block-size:.7em;margin-inline-end:.5em;border-radius:50%;background:var(--color-brand);animation:wsc-pulse 1.4s ease-in-out infinite;vertical-align:middle}
@keyframes wsc-pulse{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.wsc-mailtest__wait::before{animation:none}}
.wsc-mailtest__verdict{padding:var(--space-4);border-radius:var(--radius-sm,4px);background:var(--color-surface);border-inline-start:3px solid var(--color-success)}
.wsc-mailtest__verdict.is-bad{border-inline-start-color:var(--color-error)}
.wsc-mailtest__verdict p{margin:0}
