:root{--as-accent: #10b981;--as-accent-2: #3b82f6;--as-line: rgba(127, 127, 127, .2);--as-soft: rgba(127, 127, 127, .07);--as-muted: rgba(127, 127, 127, .9)}.as{margin:0 auto;max-width:48rem;>h1{background:linear-gradient(120deg,var(--as-accent),var(--as-accent-2));-webkit-background-clip:text;background-clip:text;color:transparent;text-align:center}}.as-search{position:relative;margin:1.5rem 0 .5rem;& input{margin:0;border-radius:999px;width:100%}& input:focus{border-color:var(--as-accent)}.htmx-indicator{position:absolute;top:50%;right:var(--mu-form-element-spacing-horizontal);transform:translateY(-50%);border-radius:999px;background:var(--mu-form-element-background-color);padding-left:.5rem;color:var(--as-muted);font-size:.85rem}& input::-webkit-search-cancel-button{-webkit-appearance:none;background:var(--mu-icon-close) center / contain no-repeat;width:1.25rem;height:1.25rem;cursor:pointer}&:has(.htmx-request) input::-webkit-search-cancel-button{visibility:hidden}}.as-hint{margin:0 0 1.5rem;color:var(--as-muted);font-size:.85rem;text-align:center}#results{transition:opacity .3s;&.htmx-swapping,&.htmx-settling{opacity:.4}}.as-message{border:1px dashed var(--as-line);border-radius:.75rem;padding:1rem;color:var(--as-muted);text-align:center}.as-count{margin:0 0 .75rem;color:var(--as-muted);font-size:.85rem}.as-list{display:grid;gap:.75rem;margin:0;padding:0;list-style:none;& li{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;border:1px solid var(--as-line);border-radius:.75rem;background:var(--as-soft);padding:.85rem 1.1rem}& li:hover{border-color:color-mix(in srgb,var(--as-accent) 60%,transparent)}& strong{display:block;overflow-wrap:anywhere}& small{color:var(--as-muted);overflow-wrap:anywhere}}.as-type{flex-shrink:0;border-radius:999px;background:color-mix(in srgb,var(--as-accent) 15%,transparent);padding:.15rem .6rem;color:var(--as-accent);font-size:.75rem;text-transform:capitalize}