/*! UX by Example — © 2026 Chris Daniels. All rights reserved. */
.sus__lead{font-size:var(--step-1);line-height:var(--leading-snug);max-inline-size:60ch;margin-block-end:var(--space-m)}.sus__score{font-family:var(--font-display);font-size:var(--step-3);line-height:1;margin-block-end:var(--space-2xs)}.sus__gauge{position:relative;block-size:0.9rem;max-inline-size:30rem;border-radius:999px;background:var(--surface-2);overflow:hidden;margin-block-end:var(--space-l)}.sus__gauge-fill{display:block;block-size:100%;inline-size:50%;background:var(--accent);border-radius:999px;transition:inline-size .12s}.sus__gauge-avg{position:absolute;inset-block:-2px;inset-inline-start:68%;inline-size:2px;background:var(--ink);z-index:1}.sus__items{display:grid;gap:var(--space-m);max-inline-size:34rem;margin-block-end:var(--space-m);padding:0;list-style:none;counter-reset:sus}.sus__item{display:grid;gap:var(--space-2xs)}.sus__item-text{font-size:var(--step-0);font-weight:600}.sus__scale{display:flex;gap:var(--space-2xs)}.sus__dot{appearance:none;inline-size:2.5rem;block-size:2.5rem;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--muted);font-weight:700;cursor:pointer}.sus__dot.is-on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.sus__dot:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.sus__readout{font-size:var(--step-0);font-weight:600;color:var(--ink);min-block-size:1.6em;padding:var(--space-2xs) var(--space-s);background:var(--accent-soft);border-radius:var(--radius-s);max-inline-size:60ch}.sus__alt{margin-block-start:var(--space-l);border-block-start:1px solid var(--line);padding-block-start:var(--space-m)}.sus__alt summary{cursor:pointer;font-weight:600;color:var(--accent-strong)}.sus__alt[open] summary{margin-block-end:var(--space-s)}