.ma-selector{--ma-ui-border:rgba(145,145,145,.28);box-sizing:border-box;display:inline-flex;flex-direction:column;gap:10px;max-width:100%;color:inherit;font-family:inherit}
.ma-selector *{box-sizing:border-box}
.ma-selector__label{display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.8}
.ma-selector__choices{display:flex;flex-wrap:wrap;gap:7px}
.ma-selector__choice{display:inline-flex;align-items:center;gap:8px;max-width:100%;border:1px solid var(--ma-ui-border);border-radius:30px;background:rgba(125,125,125,.1);color:inherit;padding:9px 13px;font:inherit;font-size:13px;line-height:1.3;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.ma-selector__choice:hover{background:rgba(125,125,125,.22);transform:translateY(-1px)}
.ma-selector__choice[aria-pressed="true"]{border-color:var(--ma-accent,#9bb9ad);background:var(--ma-surface,rgba(125,125,125,.2));box-shadow:0 0 0 1px var(--ma-accent,#9bb9ad) inset}
.ma-selector__choice:focus-visible,.ma-selector__select:focus-visible{outline:2px solid var(--ma-accent,#7baaa0);outline-offset:3px}
.ma-selector__swatch{display:inline-block;width:13px;height:13px;border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.25)}
.ma-selector__select{min-width:180px;max-width:100%;padding:10px 13px;border:1px solid var(--ma-ui-border);background:var(--ma-surface,#242424);color:var(--ma-text,#fff);border-radius:8px;font:inherit}
.ma-demo{display:grid;grid-template-columns:minmax(0,2fr) minmax(180px,1fr);gap:16px;margin:20px 0;color:var(--ma-text,#fff);font-family:var(--ma-font,Georgia,serif)}
.ma-demo__hero,.ma-demo__card{background:var(--ma-surface,#242424);color:var(--ma-text,#fff);border:1px solid var(--ma-border,#666);border-radius:var(--ma-radius,12px);padding:30px;transition:background .2s,color .2s,border .2s}
.ma-demo__eyebrow{font:600 11px/1.4 Arial,sans-serif;letter-spacing:.2em;color:var(--ma-accent,#aaa)}
.ma-demo__title{color:var(--ma-text,#fff)!important;font:700 clamp(22px,3vw,36px)/1.2 var(--ma-font,Georgia,serif)!important;margin:12px 0!important}
.ma-demo__text{color:var(--ma-muted,#aaa)!important;margin:10px 0!important}
.ma-demo__link{color:var(--ma-accent,#aaa)!important;text-decoration:none;font-weight:700}
.ma-demo__card{align-self:stretch;padding:22px}.ma-demo__card p{color:var(--ma-muted,#aaa)!important}
@media(max-width:600px){.ma-demo{grid-template-columns:1fr}.ma-selector__choice{font-size:12px;padding:8px}}
@media(prefers-reduced-motion:reduce){.ma-selector__choice,.ma-demo__hero,.ma-demo__card{transition:none}}