.button{--tone:var(--color-fg);height:var(--button-height);padding:var(--space-1) var(--space-2);color:var(--tone);font-family:var(--font-mono);font-size:var(--font-size-small);background:color-mix(in srgb, var(--tone) 6%, var(--color-bg));border:1px solid color-mix(in srgb, var(--tone) 30%, var(--color-border));border-radius:var(--border-radius);cursor:pointer;transition:background-color .12s,border-color .12s}.button:hover:not(:disabled){background:color-mix(in srgb, var(--tone) 12%, var(--color-bg));border-color:color-mix(in srgb, var(--tone) 50%, var(--color-border))}.button:disabled{opacity:.5;cursor:default}.button[data-tone=accent]{--tone:var(--color-accent)}.button[data-tone=muted]{--tone:var(--color-muted)}.button[data-tone=danger]{--tone:var(--color-error)}.button[data-size=small]{padding:var(--space-0) var(--space-1)}
.modal-dialog-backdrop{z-index:10;padding:var(--space-2);background:color-mix(in srgb, var(--color-bg) 72%, transparent);place-items:center;display:grid;position:fixed;inset:0}.modal-dialog{border:1px solid var(--color-border);border-radius:var(--border-radius);width:min(100%,38rem);padding:var(--space-3);background:var(--color-bg);box-shadow:0 var(--space-1) var(--space-3) color-mix(in srgb, var(--color-fg) 8%, transparent)}.modal-dialog header{justify-content:space-between;align-items:center;gap:var(--space-2);margin-bottom:var(--space-2);padding-bottom:var(--space-2);display:flex}.modal-dialog header h2{font-size:var(--font-size-large);text-transform:uppercase;letter-spacing:.08rem;margin:0}.modal-dialog .modal-dialog-body{gap:var(--space-2);display:grid}.modal-dialog[data-size=wide]{width:min(100%,72rem);height:min(48rem,100dvh - var(--space-3));flex-direction:column;display:flex}.modal-dialog[data-size=wide] header{flex-shrink:0}.modal-dialog[data-size=wide] .modal-dialog-body{flex:1;min-height:0}