.badge{vertical-align:middle;overflow-wrap:anywhere;background:color-mix(in srgb,var(--accent) 8%,transparent);max-width:100%;color:color-mix(in srgb,var(--accent) 80%,var(--ink));border-radius:1em;align-self:flex-start;align-items:center;gap:.4rem;padding:.25em .75em;font-size:.75rem;font-weight:600;line-height:1.5;display:inline-flex}.badge-neutral{background:color-mix(in srgb,var(--ink) 6%,transparent);color:var(--ink)}.badge-outline{box-shadow:inset 0 0 0 1px var(--line);color:var(--ink);background:0 0}.badge-solid{background:var(--accent);color:var(--on-accent)}.badge-rounded{border-radius:5px}.badge-pill,.badge-count{border-radius:999px}.badge-count{font-variant-numeric:tabular-nums;justify-content:center;min-width:2em}.badge>svg{flex:none;width:1em;height:1em}:where(.icon[data-icon]){display:inline-flex}.icon:where([data-icon]){width:var(--icon-size,1.25rem);height:var(--icon-size,1.25rem);vertical-align:middle;color:inherit;flex-shrink:0;justify-content:center;align-items:center}.icon[data-icon]>svg{block-size:100%;inline-size:100%;display:block;overflow:visible}.icon-small{--icon-size:1rem}.icon-large{--icon-size:1.5rem}.icon[data-icon-motion=draw] path{stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset var(--motion-normal) var(--motion-ease)}@media (prefers-reduced-motion:no-preference){:root:not([data-motion=none]) .btn:focus-visible:not(:hover) .icon[data-icon-motion=draw] path{animation:icon-draw var(--motion-normal) var(--motion-ease) both}}@keyframes icon-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@media (prefers-reduced-motion:reduce){.icon[data-icon-motion] path{transition:none!important;animation:none!important}}[data-motion=none] .icon[data-icon-motion] path{transition:none!important;animation:none!important}@media (hover:hover) and (prefers-reduced-motion:no-preference){:root:not([data-motion=none]) .btn:hover .icon[data-icon-motion=draw] path{animation:icon-draw-hover var(--motion-normal) var(--motion-ease) both}}@keyframes icon-draw-hover{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}.badge>.icon{--icon-size:1em}.btn{border-radius:max(var(--control-radius,7px),calc((var(--control-radius,7px) - 22px)*999));background:var(--brand,var(--accent));min-height:48px;color:var(--on-brand,var(--on-accent));overflow-wrap:anywhere;text-align:center;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;max-width:100%;padding:12px 20px;font-size:1rem;font-weight:600;line-height:1.25;text-decoration:none;display:inline-flex}.btn.compact{padding-inline:.6rem}.btn-small{gap:6px;min-height:36px;padding:8px 12px;font-size:.8125rem}@media (any-pointer:coarse){.btn-small{min-width:44px;min-height:44px}}.btn:not(:disabled):hover{background-color:var(--brand-hover,var(--accent-hover))}.btn:not(.secondary):not(.ghost){border-color:var(--brand-edge,color-mix(in srgb,var(--on-brand,var(--on-accent)) 30%,var(--brand,var(--accent))))}.btn.secondary{background:color-mix(in srgb,var(--surface) 82%,transparent);color:var(--ink)}.btn.secondary:not(:disabled):hover{background-color:color-mix(in srgb,var(--ink) 6%,transparent)}.btn.ghost{color:var(--ink);background:0 0}.btn.ghost:not(:disabled):hover{background-color:color-mix(in srgb,var(--ink) 6%,transparent)}.btn:not(.ghost){background-image:var(--finish-button,none);box-shadow:var(--finish-shadow,none)}.btn.secondary{background-color:color-mix(in srgb,var(--surface) 82%,transparent);backdrop-filter:var(--finish-blur,none);border-color:var(--finish-edge,var(--line))}.btn:not(:disabled):not(.ghost):hover{box-shadow:inset 0 0 0 1px color-mix(in srgb,currentColor 12%,transparent),var(--finish-shadow,0 0 transparent)}.btn-icon{flex:none;width:44px;height:44px;min-height:44px;padding:0}.btn>svg{flex:none;width:1.25em;height:1.25em}.btn-large{gap:12px;min-height:56px;padding:16px 28px;font-size:1.125rem}.btn-pill{border-radius:999px}.btn:not(:disabled):active{background-color:var(--brand-hover,var(--accent-hover))}.btn.secondary:not(:disabled):active,.btn.ghost:not(:disabled):active{background-color:color-mix(in srgb,var(--ink) 10%,transparent)}.btn-choice{white-space:nowrap;outline-offset:-2px;flex-direction:column;gap:8px;padding:12px 8px;line-height:24px}.btn-gradient:not(.secondary):not(.ghost){border-color:var(--paint-button-edge,var(--brand-edge,transparent));background-image:var(--paint-button,var(--finish-button,none));color:var(--on-paint-button,var(--on-brand,var(--on-accent)))}.btn-gradient:not(.secondary):not(.ghost):not(:disabled):is(:hover,:active){background-image:var(--paint-button-hover,var(--paint-button,var(--finish-button,none)))}.btn[data-toggle][aria-pressed=true]{background:var(--tint);color:var(--ink);border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.btn[data-toggle][aria-pressed=true]:not(:disabled):is(:hover,:active){background:color-mix(in srgb,var(--tint) 88%,var(--ink));box-shadow:inset 0 0 0 1px var(--accent)}@media (forced-colors:active){.btn[data-toggle][aria-pressed=true]{outline-offset:-3px;border-color:highlight;outline:2px solid highlight}}.panel{overflow-wrap:anywhere;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);min-width:0;padding:var(--space);box-shadow:var(--finish-shadow,none);border-color:var(--finish-edge,var(--line));background-color:var(--finish-surface,var(--surface));background-image:var(--finish-image,none);backdrop-filter:var(--finish-blur,none)}.panel-link{color:var(--ink);text-decoration:none}.panel-link:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--finish-edge,var(--line)))}.panel>:not(dialog,[popover]):first-child{margin-top:0}.panel>:not(dialog,[popover]):last-child{margin-bottom:0}