/**
 * SimpleMath Captcha
 *
 * @copyright   (C) 2026 SimpleMath Captcha
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 *
 * Every rule is scoped under .simplemathcaptcha so the widget can never leak into a
 * template, and every colour resolves through a custom property so a template
 * (or the plugin settings) can restyle it without overriding selectors.
 */

/* 1. TOKENS -------------------------------------------------------------- */
@property --smc-progress { syntax: "<number>"; inherits: true; initial-value: 1; }

.simplemathcaptcha {
	--smc-accent: #1d4ed8;
	--smc-radius: .375rem;
	--smc-gap: .5rem;
	--smc-input-width: 6rem;
	--smc-equation-size: 1.15rem;
	--smc-equation-weight: 600;
	--smc-timer-size: 40px;
	--smc-timer-stroke: 4px;
	--smc-bar-thickness: 4px;
	--smc-progress: 1;
	--smc-border: color-mix(in srgb, currentColor 28%, transparent);
	--smc-muted: color-mix(in srgb, currentColor 72%, transparent);
	--smc-surface: color-mix(in srgb, currentColor 4%, transparent);
	--smc-timer-track: color-mix(in srgb, currentColor 14%, transparent);
	--smc-timer-warn: color-mix(in srgb, #b45309 78%, currentColor);
	--smc-danger: color-mix(in srgb, #dc2626 76%, currentColor);
	--smc-success: color-mix(in srgb, #15803d 76%, currentColor);
	/* internal */
	--_accent: color-mix(in srgb, var(--smc-accent) 80%, currentColor);
	--_ring: color-mix(in srgb, var(--smc-accent) 45%, currentColor);
	--_field: color-mix(in srgb, currentColor 3%, transparent);
	--_ctrl: max(2.5rem, calc(var(--smc-equation-size) * 2.1));
	--_stroke: min(var(--smc-timer-stroke), calc(var(--smc-timer-size) * .25));
	--smc-timer-fill: var(--_accent);
	--_fill: var(--smc-timer-fill);

	display: block;
	position: relative;
	max-width: 100%;
	margin: 0 0 1rem;
	font: inherit;
	color: inherit;
	text-align: start;
	transition: --smc-progress 1s linear;
}
.simplemathcaptcha *, .simplemathcaptcha *::before, .simplemathcaptcha *::after { box-sizing: border-box; }

@supports not (color: color-mix(in srgb, red, blue)) {
	.simplemathcaptcha {
		--smc-border: #8a8f98; --smc-muted: #5b6069; --smc-surface: rgba(128,128,128,.08);
		--smc-timer-track: rgba(128,128,128,.25); --smc-timer-warn: #b45309;
		--smc-danger: #c62828; --smc-success: #15803d;
		--_accent: var(--smc-accent); --_ring: var(--smc-accent); --_field: transparent;
	}
}

/* 2. LAYOUT --------------------------------------------------------------- */
.simplemathcaptcha__label { margin: 0 0 .5rem; font-size: .875em; font-weight: 600; line-height: 1.3; }
.simplemathcaptcha__inner { display: flex; flex-wrap: wrap; align-items: center; gap: var(--smc-gap); min-width: 0; }
.simplemathcaptcha__challenge { display: flex; flex-wrap: wrap; align-items: center; gap: var(--smc-gap) calc(var(--smc-gap) * 1.5); min-width: 0; max-width: 100%; }

.simplemathcaptcha--singleline .simplemathcaptcha__inner { flex-wrap: nowrap; overflow-x: auto; padding-block: 4px; margin-block: -4px; }
.simplemathcaptcha--singleline .simplemathcaptcha__challenge { flex-wrap: nowrap; }
.simplemathcaptcha--singleline .simplemathcaptcha__equation { flex-wrap: nowrap; }

.simplemathcaptcha--stacked .simplemathcaptcha__inner,
.simplemathcaptcha--stacked .simplemathcaptcha__challenge { flex-direction: column; align-items: flex-start; }

.simplemathcaptcha--card {
	padding: .875rem 1rem;
	border: 1px solid var(--smc-border);
	border-radius: min(calc(var(--smc-radius) * 2), 1rem);
	background: var(--smc-surface);
}

/* Compact and large scale the equation, field and timer together as one unit. */
.simplemathcaptcha--size-compact { --smc-equation-size: 1rem; --smc-timer-size: 32px; --smc-input-width: 5rem; --_ctrl: 2.25rem; }
.simplemathcaptcha--size-large { --smc-equation-size: 1.6rem; --smc-timer-size: 56px; --smc-input-width: 7.5rem; }

/* 3. EQUATION -------------------------------------------------------------- */
.simplemathcaptcha__equation {
	display: inline-flex; flex-wrap: wrap; align-items: baseline;
	column-gap: .38em; row-gap: .05em;
	direction: ltr; unicode-bidi: isolate;
	font-size: var(--smc-equation-size);
	font-weight: var(--smc-equation-weight);
	line-height: 1.25;
	font-variant-numeric: tabular-nums lining-nums;
	letter-spacing: -.005em;
}
.simplemathcaptcha__operand { white-space: nowrap; }
.simplemathcaptcha__operand--word { font-weight: min(var(--smc-equation-weight), 500); font-size: .92em; letter-spacing: .005em; }
.simplemathcaptcha__operator, .simplemathcaptcha__equals { min-width: .7em; text-align: center; }
.simplemathcaptcha.is-fresh .simplemathcaptcha__equation { animation: smc-in .28s cubic-bezier(.2,.7,.3,1); }
.simplemathcaptcha.is-expired .simplemathcaptcha__equation { color: var(--smc-muted); text-decoration: line-through; text-decoration-thickness: .08em; text-decoration-color: var(--smc-muted); }

/* 4. INPUT ------------------------------------------------------------------ */
.simplemathcaptcha__field { position: relative; display: inline-flex; flex: 0 1 auto; width: var(--smc-input-width); min-width: 3.5rem; max-width: 100%; }
.simplemathcaptcha .simplemathcaptcha__input {
	display: block; flex: 0 1 var(--smc-input-width);
	width: var(--smc-input-width); min-width: 3.5rem; max-width: 100%;
	height: var(--_ctrl); min-height: var(--_ctrl);
	margin: 0; padding: 0 .75em;
	font: inherit; font-size: max(1rem, calc(var(--smc-equation-size) * .92)); font-weight: 500;
	font-variant-numeric: tabular-nums; line-height: 1.2; text-align: center;
	color: inherit; background: var(--_field);
	border: 1px solid var(--smc-border); border-radius: var(--smc-radius);
	box-shadow: none; appearance: none;
	transition: border-color .15s, box-shadow .15s, background-color .15s;
}
.simplemathcaptcha__field .simplemathcaptcha__input { width: 100%; flex: 1 1 auto; }
.simplemathcaptcha .simplemathcaptcha__input::placeholder { color: var(--smc-muted); opacity: 1; }
.simplemathcaptcha .simplemathcaptcha__input:hover { border-color: color-mix(in srgb, currentColor 50%, transparent); }
.simplemathcaptcha .simplemathcaptcha__input:focus { outline: 2px solid var(--_ring); outline-offset: 2px; border-color: var(--_ring); box-shadow: none; color: inherit; background: var(--_field); }
.simplemathcaptcha .simplemathcaptcha__input.is-verified { border-color: var(--smc-success); box-shadow: inset 0 0 0 1px var(--smc-success); padding-inline-end: 2em; }
.simplemathcaptcha .simplemathcaptcha__input[readonly] { border-style: dashed; background: transparent; }
.simplemathcaptcha.is-retry .simplemathcaptcha__input { border-color: var(--smc-danger); }

/* An in-field badge: a checkmark once verified, a muted spinner while a live check
   (not a challenge reload) is in flight - the two are visually distinct so a visitor
   never reads "checking" as "already correct" or vice versa. */
.simplemathcaptcha__field::after {
	content: ""; position: absolute; inset-inline-end: .7em; top: 50%;
	width: 1em; height: 1em; margin-top: -.5em; pointer-events: none;
	background: var(--smc-success); opacity: 0; transform: scale(.6);
	-webkit-mask: var(--_i-check) center / contain no-repeat; mask: var(--_i-check) center / contain no-repeat;
	transition: opacity .2s, transform .25s cubic-bezier(.3,1.5,.6,1);
}
.simplemathcaptcha__field:has(.is-verified)::after { opacity: 1; transform: none; }
.simplemathcaptcha.is-busy[data-smc-busy="check"] .simplemathcaptcha__field::after {
	opacity: 1; transform: none; background: var(--smc-muted);
	-webkit-mask-image: var(--_i-spin); mask-image: var(--_i-spin);
	animation: smc-spin .8s linear infinite;
}

/* 5. TIMER ------------------------------------------------------------------ */
.simplemathcaptcha__timer {
	flex: none; position: relative; display: inline-grid; place-items: center;
	width: var(--smc-timer-size); height: var(--smc-timer-size);
	font-variant-numeric: tabular-nums;
}
.simplemathcaptcha--timer-circle .simplemathcaptcha__timer { container-type: inline-size; }
.simplemathcaptcha--timer-left .simplemathcaptcha__timer { order: -1; }
.simplemathcaptcha.is-warning { --_fill: var(--smc-timer-warn); }
.simplemathcaptcha.is-expired { --_fill: transparent; }

.simplemathcaptcha--timer-circle .simplemathcaptcha__timer::before,
.simplemathcaptcha--timer-pie .simplemathcaptcha__timer::before {
	content: ""; position: absolute; inset: 0; border-radius: 50%;
	background: conic-gradient(var(--smc-timer-track) calc((1 - var(--smc-progress)) * 360deg), var(--_fill) 0);
}
.simplemathcaptcha--timer-circle .simplemathcaptcha__timer::before {
	-webkit-mask: radial-gradient(farthest-side, transparent calc(100% - var(--_stroke) - .5px), #000 calc(100% - var(--_stroke)));
	mask: radial-gradient(farthest-side, transparent calc(100% - var(--_stroke) - .5px), #000 calc(100% - var(--_stroke)));
}
.simplemathcaptcha--timer-pie .simplemathcaptcha__timer::before {
	inset: max(2px, 12%);
	background: conic-gradient(transparent calc((1 - var(--smc-progress)) * 360deg), var(--_fill) 0);
}
.simplemathcaptcha--timer-pie .simplemathcaptcha__timer::after {
	content: ""; position: absolute; inset: 0; border-radius: 50%;
	border: max(1px, calc(var(--smc-timer-size) * .045)) solid var(--smc-timer-track);
}
.simplemathcaptcha__secs { position: relative; font-size: max(10px, calc(var(--smc-timer-size) * .3)); font-weight: 600; line-height: 1; letter-spacing: -.03em; }
.simplemathcaptcha:not(.simplemathcaptcha--timer-circle) .simplemathcaptcha__secs { display: none; }
.simplemathcaptcha.is-warning .simplemathcaptcha__secs { color: var(--smc-timer-warn); }
@container (max-width: 29px) { .simplemathcaptcha__secs { display: none; } }

.simplemathcaptcha--timer-dots .simplemathcaptcha__timer {
	--_d: max(4px, calc(var(--smc-timer-size) * .16));
	display: inline-flex; align-items: center; gap: calc(var(--_d) * .55); width: auto;
}
.simplemathcaptcha__dot { width: var(--_d); height: calc(var(--_d) * 2.2); border-radius: var(--_d); background: var(--_fill); transition: background-color .3s, transform .3s; }
.simplemathcaptcha__dot.is-spent { background: var(--smc-timer-track); transform: scaleY(.55); }

.simplemathcaptcha--timer-equation .simplemathcaptcha__equation {
	/* the whole tile is the timer: a tint of the fill colour drains from the end edge */
	--_tint: color-mix(in srgb, var(--_fill) 20%, transparent);
	padding: .2em .6em; min-height: var(--_ctrl); align-items: center; border-radius: var(--smc-radius);
	border: 1px solid color-mix(in srgb, var(--_fill) 55%, transparent);
	background:
		linear-gradient(var(--_tint), var(--_tint)) 0 0 / calc(var(--smc-progress) * 100%) 100% no-repeat,
		var(--smc-surface);
	transition: border-color .3s;
}
.simplemathcaptcha--timer-equation:dir(rtl) .simplemathcaptcha__equation { background-position: 100% 0, 0 0; }
.simplemathcaptcha--timer-equation.is-expired .simplemathcaptcha__equation { border-color: var(--smc-border); border-style: dashed; }
.simplemathcaptcha--timer-equation:not(.is-enhanced) .simplemathcaptcha__equation { border-color: var(--smc-border); background: var(--smc-surface); }
@supports not (color: color-mix(in srgb, red, blue)) {
	.simplemathcaptcha--timer-equation .simplemathcaptcha__equation { --_tint: rgba(29,78,216,.18); border-color: var(--smc-border); }
}
@media (forced-colors: active) {
	.simplemathcaptcha--timer-equation .simplemathcaptcha__equation { --_tint: Highlight; color: CanvasText; border-color: CanvasText; }
	.simplemathcaptcha--timer-equation .simplemathcaptcha__equation { background-size: calc(var(--smc-progress) * 100%) 4px, auto; background-position: 0 100%, 0 0; }
}

.simplemathcaptcha__bar { display: block; position: relative; height: var(--smc-bar-thickness); margin-top: calc(var(--smc-gap) * 1.25); border-radius: 999px; background: var(--smc-timer-track); overflow: hidden; }
.simplemathcaptcha__bar-fill { position: absolute; inset: 0; border-radius: inherit; background: var(--_fill); transform-origin: left; transform: scaleX(var(--smc-progress)); transition: background-color .3s; }
.simplemathcaptcha:dir(rtl) .simplemathcaptcha__bar-fill { transform-origin: right; }
[dir="rtl"] .simplemathcaptcha__bar-fill { transform-origin: right; }

/* Ring draws around the refresh button itself (see section 6), so it needs no
   dedicated indicator element of its own - same as underline and equation. */
.simplemathcaptcha--timer-hidden .simplemathcaptcha__timer,
.simplemathcaptcha--timer-off .simplemathcaptcha__timer,
.simplemathcaptcha--timer-underline .simplemathcaptcha__timer,
.simplemathcaptcha--timer-equation .simplemathcaptcha__timer,
.simplemathcaptcha--timer-ring .simplemathcaptcha__timer,
.simplemathcaptcha:not(.simplemathcaptcha--timer-underline) .simplemathcaptcha__bar { display: none; }

/* 6. REFRESH ----------------------------------------------------------------- */
.simplemathcaptcha .simplemathcaptcha__refresh {
	flex: none; position: relative; display: inline-grid; place-items: center;
	width: var(--_ctrl); height: var(--_ctrl); margin: 0; padding: 0;
	color: var(--smc-muted); background: transparent;
	border: 1px solid var(--smc-border); border-radius: var(--smc-radius);
	box-shadow: none; cursor: pointer; font: inherit; line-height: 1;
	transition: color .15s, background-color .15s, border-color .15s, box-shadow .2s;
}
.simplemathcaptcha__refresh svg { width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.simplemathcaptcha .simplemathcaptcha__refresh:hover:not(:disabled) { color: inherit; background: var(--smc-surface); border-color: color-mix(in srgb, currentColor 50%, transparent); }
.simplemathcaptcha .simplemathcaptcha__refresh:focus-visible { outline: 2px solid var(--_ring); outline-offset: 2px; }
.simplemathcaptcha .simplemathcaptcha__refresh:disabled { cursor: default; opacity: .5; }
.simplemathcaptcha.is-busy:not([data-smc-busy="check"]) .simplemathcaptcha__refresh svg { animation: smc-spin .9s linear infinite; }
.simplemathcaptcha.is-busy:not([data-smc-busy="check"]) .simplemathcaptcha__refresh:disabled { opacity: .8; }
.simplemathcaptcha.is-expired .simplemathcaptcha__refresh { color: var(--_accent); border-color: var(--_ring); }
.simplemathcaptcha.is-expired[data-smc-expire-action="manual"] .simplemathcaptcha__refresh {
	background: color-mix(in srgb, var(--_ring) 12%, transparent);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--_ring) 25%, transparent);
	animation: smc-beckon 1.8s ease-out infinite;
}
.simplemathcaptcha--timer-ring .simplemathcaptcha__refresh::before {
	content: ""; position: absolute; inset: -4px; padding: 3px; border-radius: calc(var(--smc-radius) + 4px);
	background: conic-gradient(var(--smc-timer-track) calc((1 - var(--smc-progress)) * 360deg), var(--_fill) 0);
	-webkit-mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
	mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
	pointer-events: none;
}
@media (pointer: coarse) { .simplemathcaptcha .simplemathcaptcha__refresh { min-width: 44px; min-height: 44px; } }

/* 7. HELP · PRIVACY · STATUS -------------------------------------------------- */
.simplemathcaptcha__help, .simplemathcaptcha__privacy { margin: .5rem 0 0; font-size: .875em; line-height: 1.45; color: var(--smc-muted); text-wrap: pretty; }
.simplemathcaptcha__privacy { display: flex; gap: .45em; align-items: flex-start; }
.simplemathcaptcha__privacy::before, .simplemathcaptcha__status::before {
	content: ""; flex: none; width: 1.1em; height: 1.1em; margin-top: .18em; background: currentColor;
	-webkit-mask: var(--_icon) center / contain no-repeat; mask: var(--_icon) center / contain no-repeat;
}
.simplemathcaptcha__privacy::before { --_icon: var(--_i-shield); }
.simplemathcaptcha__help + .simplemathcaptcha__privacy { margin-top: .25rem; }

.simplemathcaptcha__status {
	display: flex; gap: .45em; align-items: flex-start;
	margin: .5rem 0 0; min-height: 2.9em; /* two lines reserved: no layout shift */
	font-size: .875em; line-height: 1.45; color: var(--smc-muted); text-wrap: pretty;
}
.simplemathcaptcha__status::before { display: none; background: var(--_sev, currentColor); }
.simplemathcaptcha__status:empty { visibility: hidden; }
/* auto/inherit: text stays currentColor (full contrast on any ground), the glyph carries the colour */
.simplemathcaptcha__status[data-severity="success"] { --_icon: var(--_i-ok); --_sev: var(--smc-success); color: inherit; font-weight: 500; }
.simplemathcaptcha__status[data-severity="warning"] { --_icon: var(--_i-warn); --_sev: var(--smc-timer-warn); color: inherit; font-weight: 500; }
.simplemathcaptcha__status[data-severity="error"] { --_icon: var(--_i-err); --_sev: var(--smc-danger); color: inherit; font-weight: 500; }
.simplemathcaptcha:is(.simplemathcaptcha--theme-light, .simplemathcaptcha--theme-dark) .simplemathcaptcha__status[data-severity] { color: var(--_sev, inherit); }
.simplemathcaptcha__status:is([data-severity="success"], [data-severity="warning"], [data-severity="error"])::before { display: block; }

/* 8. HIDDEN HELPERS ----------------------------------------------------------- */
.simplemathcaptcha__sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.simplemathcaptcha__hp { position: absolute !important; inset-inline-start: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.simplemathcaptcha:not(.is-enhanced) :is(.simplemathcaptcha__timer, .simplemathcaptcha__refresh, .simplemathcaptcha__bar) { display: none; }
.simplemathcaptcha:not(.is-enhanced) .simplemathcaptcha__equation { --smc-progress: 1; }

/* 9. THEMES (auto = base tokens) ---------------------------------------------- */
.simplemathcaptcha--theme-light {
	--smc-border: #8a8f98; --smc-muted: #555a63; --smc-surface: rgba(15,23,42,.035);
	--smc-timer-track: #e2e5ea; --smc-timer-warn: #b45309; --smc-danger: #b91c1c; --smc-success: #15803d;
	--_accent: var(--smc-accent); --_ring: var(--smc-accent); --_field: #fff;
}
.simplemathcaptcha--theme-dark {
	--smc-accent: #6f9dff;
	--smc-border: #7b8494; --smc-muted: #b3bac5; --smc-surface: rgba(255,255,255,.05);
	--smc-timer-track: rgba(255,255,255,.16); --smc-timer-warn: #fbbf24; --smc-danger: #fca5a5; --smc-success: #6ee7a0;
	--_accent: var(--smc-accent); --_ring: var(--smc-accent); --_field: rgba(0,0,0,.2);
}
.simplemathcaptcha--theme-inherit {
	--_accent: currentColor; --_ring: currentColor; --smc-surface: transparent; --_field: transparent;
	--smc-timer-track: color-mix(in srgb, currentColor 20%, transparent);
	--smc-timer-warn: currentColor; --smc-danger: currentColor; --smc-success: currentColor;
}
.simplemathcaptcha--theme-inherit.is-warning .simplemathcaptcha__timer { opacity: .7; }

/* 10. HIGH CONTRAST (7:1 text, 4.5:1 boundaries) ------------------------------ */
.simplemathcaptcha--contrast {
	--smc-border: currentColor; --smc-muted: currentColor; --_ring: currentColor; --_field: transparent;
	--smc-timer-track: color-mix(in srgb, currentColor 30%, transparent);
}
.simplemathcaptcha--contrast .simplemathcaptcha__input, .simplemathcaptcha--contrast .simplemathcaptcha__refresh { border-width: 2px; }
.simplemathcaptcha--contrast .simplemathcaptcha__input:focus, .simplemathcaptcha--contrast .simplemathcaptcha__refresh:focus-visible { outline-width: 3px; }
.simplemathcaptcha--contrast .simplemathcaptcha__status { color: inherit; font-weight: 600; }
.simplemathcaptcha--contrast.simplemathcaptcha--card { border-width: 2px; }

/* 11. REDUCED MOTION ----------------------------------------------------------- */
.simplemathcaptcha.smc-no-motion, .simplemathcaptcha.smc-no-motion *, .simplemathcaptcha.smc-no-motion *::before, .simplemathcaptcha.smc-no-motion *::after { animation: none !important; transition: none !important; }
.simplemathcaptcha.smc-no-motion.is-busy[data-smc-busy="check"] .simplemathcaptcha__field::after { -webkit-mask-image: var(--_i-dots); mask-image: var(--_i-dots); }
@media (prefers-reduced-motion: reduce) {
	.simplemathcaptcha, .simplemathcaptcha *, .simplemathcaptcha *::before, .simplemathcaptcha *::after { animation: none !important; transition: none !important; }
	.simplemathcaptcha.is-busy[data-smc-busy="check"] .simplemathcaptcha__field::after { -webkit-mask-image: var(--_i-dots); mask-image: var(--_i-dots); }
}

/* 12. FORCED COLOURS ------------------------------------------------------------ */
@media (forced-colors: active) {
	.simplemathcaptcha { --smc-border: CanvasText; --smc-muted: CanvasText; --_ring: Highlight; --_fill: Highlight; --smc-timer-track: GrayText; --smc-success: CanvasText; --smc-danger: CanvasText; --smc-timer-warn: CanvasText; }
	.simplemathcaptcha.is-warning { --_fill: Mark; }
	.simplemathcaptcha :is(.simplemathcaptcha__timer, .simplemathcaptcha__dot, .simplemathcaptcha__bar, .simplemathcaptcha__bar-fill, .simplemathcaptcha__equation, .simplemathcaptcha__field, .simplemathcaptcha__status, .simplemathcaptcha__privacy) { forced-color-adjust: none; }
	.simplemathcaptcha :is(.simplemathcaptcha__status, .simplemathcaptcha__privacy, .simplemathcaptcha__equation) { color: CanvasText; }
	.simplemathcaptcha__status::before, .simplemathcaptcha__privacy::before, .simplemathcaptcha__field::after { background: CanvasText; }
	.simplemathcaptcha .simplemathcaptcha__input.is-verified { border-width: 3px; }
}

/* 13. ICONS & MOTION -------------------------------------------------------------- */
.simplemathcaptcha {
	--_i-check: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M3.2 8.6l3 3 6.6-7'/></svg>");
	--_i-ok: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><circle cx='8' cy='8' r='6.6'/><path d='M5.2 8.2l1.9 1.9 3.8-4'/></svg>");
	--_i-warn: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M8 1.9l6.6 11.6H1.4z'/><path d='M8 6.3v3.4M8 11.7v.1'/></svg>");
	--_i-err: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'><circle cx='8' cy='8' r='6.6'/><path d='M5.7 5.7l4.6 4.6M10.3 5.7l-4.6 4.6'/></svg>");
	--_i-shield: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M8 1.6l5.4 2v4.1c0 3.2-2.3 5.6-5.4 6.7-3.1-1.1-5.4-3.5-5.4-6.7V3.6z'/><path d='M5.7 8l1.6 1.6 3-3.1'/></svg>");
	--_i-spin: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'><circle cx='8' cy='8' r='6' stroke-opacity='.25'/><path d='M8 2a6 6 0 0 1 6 6'/></svg>");
	--_i-dots: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><circle cx='3' cy='8' r='1.6'/><circle cx='8' cy='8' r='1.6'/><circle cx='13' cy='8' r='1.6'/></svg>");
}
@keyframes smc-spin { to { transform: rotate(360deg); } }
@keyframes smc-in { from { opacity: 0; transform: translateY(.3em); } }
@keyframes smc-beckon {
	0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--_ring) 45%, transparent); }
	70%, 100% { box-shadow: 0 0 0 7px transparent; }
}