/* Ponte entre os tokens visuais do WSX e novas telas escritas com Tailwind. */
.tw-app {
  color: var(--ws-color-text);
  background: var(--ws-color-surface);
  font-family: Inter, "Noto Sans", Arial, sans-serif;
}

.tw-card {
  background: var(--ws-color-card);
  border: 1px solid var(--ws-color-border);
  border-radius: var(--ws-border-radius);
}

.tw-focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.tw-focus:focus-visible {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ws-color-primary) 28%, transparent);
}