/* Shared Proof primitives. Screen layouts are built separately. */
.proof-button, .proof-input, .proof-tab { font: inherit; box-sizing: border-box; }
.proof-button {
  display: inline-flex; align-items: center; justify-content: center;
  gap: var(--proof-space-2); min-height: var(--proof-control-height);
  padding: var(--proof-space-3) var(--proof-space-5);
  border: var(--proof-border-width) solid var(--proof-control-border);
  border-radius: var(--proof-radius-control);
  background: var(--proof-surface); color: var(--proof-text);
  font-size: var(--proof-font-body); font-weight: var(--proof-weight-medium);
  line-height: var(--proof-leading-label); text-decoration: none; cursor: pointer;
  transition: background-color var(--proof-duration-fast) var(--proof-ease),
    border-color var(--proof-duration-fast) var(--proof-ease);
}
.proof-button:hover { background: var(--proof-surface-hover); }
.proof-button:active { background: var(--proof-selection); }
.proof-button--primary { background: var(--proof-primary); border-color: var(--proof-primary); color: var(--proof-text-on-action); }
.proof-button--primary:hover { background: var(--proof-primary-hover); border-color: var(--proof-primary-hover); }
.proof-button--primary:active { background: var(--proof-primary-pressed); border-color: var(--proof-primary-pressed); }
.proof-button--quiet { background: transparent; color: var(--proof-selection-text); border-color: transparent; }
.proof-button--compact { min-height: var(--proof-control-compact); padding: var(--proof-space-2) var(--proof-space-3); font-size: var(--proof-font-sm); }
.proof-button:disabled, .proof-button[aria-disabled="true"] {
  background: var(--proof-disabled-surface); border-color: transparent;
  color: var(--proof-disabled-text); cursor: not-allowed;
}
.proof-button[aria-busy="true"] { cursor: progress; }
.proof-button svg, .proof-icon { width: var(--proof-icon-size); height: var(--proof-icon-size); flex-shrink: 0; }
.proof-input {
  display: block; width: 100%; min-height: var(--proof-control-height);
  padding: var(--proof-space-3) var(--proof-space-4);
  border: var(--proof-border-width) solid var(--proof-control-border);
  border-radius: var(--proof-radius-control); background: var(--proof-surface);
  color: var(--proof-text); font-size: var(--proof-font-body); line-height: var(--proof-leading-label);
}
.proof-input::placeholder { color: var(--proof-text-muted); opacity: 1; }
.proof-input:hover { border-color: var(--proof-text-muted); }
.proof-input[aria-invalid="true"] { border-color: var(--proof-error); }
.proof-input:disabled { background: var(--proof-disabled-surface); color: var(--proof-disabled-text); cursor: not-allowed; }
.proof-button:focus-visible, .proof-input:focus-visible, .proof-tab:focus-visible, .proof-surface a:focus-visible {
  outline: var(--proof-focus-width) solid var(--proof-focus); outline-offset: var(--proof-focus-offset);
}
.proof-label { display: block; margin-bottom: var(--proof-space-2); font-size: var(--proof-font-sm); font-weight: var(--proof-weight-medium); }
.proof-hint { margin: var(--proof-space-2) 0 0; color: var(--proof-text-muted); font-size: var(--proof-font-sm); line-height: var(--proof-leading-body); }
.proof-hint--error { color: var(--proof-error); }
.proof-tabs { display: flex; gap: var(--proof-space-6); border-bottom: var(--proof-border-width) solid var(--proof-border); }
.proof-tab {
  min-height: var(--proof-control-height); border: 0; border-bottom: 2px solid transparent;
  padding: var(--proof-space-3) var(--proof-space-2); background: transparent;
  color: var(--proof-text-muted); cursor: pointer; font-size: var(--proof-font-body);
}
.proof-tab:hover { color: var(--proof-text); background: var(--proof-surface-subtle); }
.proof-tab[aria-selected="true"], .proof-tab[aria-current="page"] { color:var(--proof-primary-text); border-bottom-color: var(--proof-primary); }
.proof-tab:disabled { color: var(--proof-disabled-text); cursor: not-allowed; }
.proof-status { display: inline-flex; align-items: center; gap: var(--proof-space-2); color: var(--proof-text-muted); font-size: var(--proof-font-sm); }
.proof-status::before { content: ""; width: 8px; height: 8px; border-radius: var(--proof-radius-round); background: currentColor; }
.proof-status--success { color: var(--proof-success); }
.proof-status--warning { color: var(--proof-warning); }
.proof-status--error { color: var(--proof-error); }
.proof-status--info { color: var(--proof-info); }
.proof-spinner { width: 16px; height: 16px; border: 2px solid currentColor; border-right-color: transparent; border-radius: var(--proof-radius-round); animation: proof-spin .8s linear infinite; }
@keyframes proof-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .proof-spinner { animation: none; } }

