.uxa-demo .ui-example{display:grid;gap:14px;align-content:center}.uxa-demo input:not([type=range]):not([type=file]){width:100%;max-width:420px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink)}.uxa-demo input:focus-visible,.uxa-demo button:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 40%,transparent);outline-offset:2px}.uxa-icon-row,.uxa-thumbs,.uxa-format-bar,.uxa-rating,.uxa-choice-grid{display:flex;gap:10px;flex-wrap:wrap}.uxa-icon-row button{min-width:54px;font-size:1.15rem}.uxa-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:12px;border:1px solid var(--line);background:var(--paper)}.uxa-big-thumb{display:grid;place-items:center;min-height:150px;border-radius:18px;background:linear-gradient(145deg,var(--lime),var(--paper));font-size:4rem}.uxa-thumbs button[aria-pressed=true],.uxa-choice-grid button[aria-pressed=true],.uxa-format-bar button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.uxa-suggest{display:grid;max-width:420px;border:1px solid var(--line);border-radius:10px;overflow:hidden}.uxa-suggest button{padding:10px 14px;border:0;border-bottom:1px solid var(--line);text-align:left;background:var(--paper);color:var(--ink)}.uxa-suggest button[aria-selected=true]{background:var(--lime)}.uxa-choice-grid button{min-width:96px}.uxa-rating button{border:0;background:transparent;color:var(--accent);font-size:2rem;padding:4px}.uxa-tagbox{display:flex;gap:8px;flex-wrap:wrap;min-height:42px}.uxa-tagbox button{border:1px solid var(--line);border-radius:999px;padding:7px 11px;background:var(--lime);color:var(--ink)}.uxa-swatches{display:flex;gap:10px;flex-wrap:wrap}.uxa-swatches button{border:3px solid transparent;border-radius:12px;padding:12px;background:var(--swatch);color:white;text-shadow:0 1px 2px #0008}.uxa-swatches button[aria-selected=true]{border-color:var(--ink);box-shadow:0 0 0 2px var(--paper) inset}.uxa-format-preview{padding:18px;border-left:4px solid var(--accent);background:var(--paper)}.uxa-format-preview.bold{font-weight:800}.uxa-format-preview.italic{font-style:italic}.uxa-format-preview.underline{text-decoration:underline}@media(max-width:600px){.uxa-choice-grid{display:grid;grid-template-columns:1fr 1fr}.uxa-icon-row button{min-height:48px}.uxa-demo input[type=range]{width:100%}}@media(prefers-reduced-motion:reduce){.uxa-demo *{scroll-behavior:auto!important;transition:none!important}}
.uxa-big-thumb{overflow:hidden;font-size:initial}.uxa-big-thumb svg{display:block;width:100%;height:180px}.uxa-thumbs button{width:86px;padding:0;overflow:hidden}.uxa-thumbs svg{display:block;width:100%;height:48px}.uxa-swatches button[aria-pressed=true]{border-color:var(--ink);box-shadow:0 0 0 2px var(--paper) inset}.uxa-range-track{position:relative;height:8px;border-radius:99px;background:var(--line)}.uxa-range-track i{position:absolute;inset-block:0;border-radius:99px;background:var(--accent)}.uxa-momentary:active{transform:translateY(2px);filter:brightness(.82)}