.ui-button { font: inherit; color: var(--ui-color-accent-text); background: var(--ui-color-accent); border: var(--ui-border-width) solid var(--ui-color-border); border-radius: var(--ui-radius-control); padding: var(--ui-space-sm) var(--ui-space-md); cursor: pointer; }
.ui-button:disabled { cursor: default; opacity: .6; }
.ui-surface { color: var(--ui-color-text); background: var(--ui-color-surface); border: var(--ui-border-width) solid var(--ui-color-border); border-radius: var(--ui-radius-surface); padding: var(--ui-space-lg); }
.ui-icon { width: var(--ui-size-icon); height: var(--ui-size-icon); fill: currentColor; }
.ui-field { display: grid; gap: var(--ui-space-sm); font-family: var(--ui-font-body); font-size: var(--ui-size-body); }
.ui-field input, .ui-field select { font: inherit; color: var(--ui-color-text); background: var(--ui-color-surface); border: var(--ui-border-width) solid var(--ui-color-border); border-radius: var(--ui-radius-control); padding: var(--ui-space-sm); }
.ui-error { color: var(--ui-color-error); }
.ui-status { color: var(--ui-color-text); }
.ui-pages { display: flex; align-items: center; gap: var(--ui-space-md); }
