Radio Group

Single-choice selection for damage classification, yes/no questions, and mutually exclusive options. Two variants: compact standard list and prominent card layout.

Preview — Standard List

Is debris blocking access? Yes — road is impassable No — access is clear Unknown — could not verify

Preview — Card Variant (Damage Classification)

Damage classification

Minimal

Cosmetic damage, infrastructure still usable

Partial

Significant damage, limited functionality

Complete

Fully destroyed or impassable

Variants

Variant	Usage
standard	Quick yes/no questions, simple lists (2-5 options)
card	Important choices with descriptions, damage classification, colored indicators

States

Error State

Is this infrastructure operational? Yes No

Please select whether the infrastructure is operational.

Accessibility

Uses semantic <fieldset> and <legend> elements.
Standard variant shows visible radio inputs; card variant uses sr-only inputs with aria-label.
Selected state uses has-[:checked] for CSS-only visual feedback.
Color dots in card variant are decorative (aria-hidden) — the label text carries the meaning.

Trauma-Informed Design

Card variant with color dots provides instant visual classification — green/amber/red maps to minimal/partial/complete damage.
Standard options include "Unknown" where applicable — never force users to guess.
Each option is a 48px-height touch target in standard variant, and larger in card variant.
Descriptions in card variant reduce ambiguity: "Cosmetic damage, infrastructure still usable."