@layer components{.button[data-focus-visible],.button:focus-visible{outline:var(--outline-thick) solid var(--focus);outline-offset:3px}.button{border-radius:var(--radius-m);box-shadow:var(--edge);cursor:pointer;font-size:var(--text-m);align-items:center;gap:var(--space-xs);min-height:var(--control-m);padding:var(--space-s) var(--space-m);text-align:center;transition:background-color var(--transition-fast), color var(--transition-fast), scale var(--transition-fast) var(--ease-out);flex:none;justify-content:center;font-weight:600;line-height:1.15;text-decoration:none;display:inline-flex}.button .icon{font-size:var(--icon-m)}.button[data-hovered]:not([data-disabled]){background:var(--surface)}.button[data-pressed]:not([data-disabled]){scale:.985}.button[data-disabled]{color:var(--ink-dim);cursor:not-allowed}.button.primary{background:var(--ink);box-shadow:none;color:var(--on-ink);font-size:var(--text-l);min-height:var(--control-l);font-weight:700}.button.primary[data-hovered]:not([data-disabled]){background:var(--ink);filter:brightness(.92)}.button.primary[data-disabled]{background:var(--surface-raised);color:var(--ink-dim)}.button.quiet{box-shadow:none;color:var(--ink-muted);min-height:var(--control-touch);padding-inline:var(--space-s)}.button.quiet[data-hovered]:not([data-disabled]){background:var(--surface-raised);color:var(--ink)}.button.stop{background:var(--ink);box-shadow:none;color:var(--on-ink);font-weight:700}.button.stop[data-hovered]:not([data-disabled]){background:var(--ink);filter:brightness(.92)}.button.stop[data-disabled]{background:var(--surface-raised);color:var(--ink-muted)}.brand-mark{font-size:var(--text-base);align-items:center;gap:var(--space-xs);font-weight:700;display:inline-flex}.brand-mark svg{fill:none;stroke-linecap:round;stroke-width:2px;width:1.5em;height:1.5em}.brand-mark .frame{stroke:currentColor}.brand-mark .lit{stroke:var(--live);stroke-width:2.4px}:where(#main){flex-direction:column;flex:1;display:flex}:where(#main):focus{outline:none}}