:root {
  --vetka-page-bg: #1f1f1f;
  --vetka-page-panel-bg: #262626;
  --vetka-page-card-bg: rgba(26, 26, 26, 0.92);
  --vetka-page-control-bg: #2c2c2c;
  --vetka-page-control-bg-soft: rgba(57, 57, 57, 0.34);
  --vetka-page-control-bg-hover: rgba(57, 57, 57, 0.68);
  --vetka-page-border-subtle: rgba(255, 255, 255, 0.08);
  --vetka-page-border-control: #3a3a3a;
  --vetka-page-border-control-hover: #525252;
  --vetka-page-border-control-focus: #7a7a7a;
  --vetka-page-border-strong: #696969;
  --vetka-text-primary: #ffffff;
  --vetka-text-muted: #b7b7b7;
  --vetka-text-subtle: #707070;
  --vetka-text-placeholder: #8f8f93;
  --vetka-danger: #f15555;
  --vetka-danger-border: rgba(222, 73, 73, 0.6);
  --vetka-pending-border: rgba(216, 182, 88, 0.75);
  --vetka-ready-border: rgba(110, 190, 135, 0.7);
  --vetka-radius-control: 8px;
  --vetka-radius-pill: 24px;
  --vetka-auth-form-width: 672px;
  --vetka-profile-shell-width: 963px;
  --vetka-profile-sidebar-width: 211px;
  --vetka-profile-panel-width: 672px;
  --vetka-profile-panel-height: 610px;
  --vetka-shadow-panel: 0 20px 56px rgba(0, 0, 0, 0.22);
  --vetka-shadow-card: 0 24px 80px rgba(0, 0, 0, 0.28);
  color-scheme: dark;
}

* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  min-height: 100%;
  margin: 0;
  background: var(--vetka-page-bg);
}

body {
  min-height: 100vh;
  font-family: Inter, Mulish, sans-serif;
  color: var(--vetka-text-primary);
  text-rendering: geometricPrecision;
}

button,
input,
textarea {
  font: inherit;
}

a[href],
button:not(:disabled),
label[for],
[role='tab']:not([aria-disabled='true']) {
  cursor: pointer;
}

button:disabled,
[aria-disabled='true'] {
  cursor: not-allowed;
}

:is(.auth-flow-page, .profile-page) {
  min-height: 100vh;
  background: var(--vetka-page-bg);
  color: var(--vetka-text-primary);
}

[data-page-card] {
  border: 1px solid var(--vetka-page-border-subtle);
  border-radius: var(--vetka-radius-control);
  background: var(--vetka-page-card-bg);
  box-shadow: var(--vetka-shadow-card);
}

:is(.auth-flow-page, .profile-page) :focus-visible {
  outline: 1px solid rgba(255, 255, 255, 0.48);
  outline-offset: 2px;
}

:is(
  .integration-state-panel,
  .reg-access-state,
  .confirm-integration-state,
  .profile-integration-state,
  .billing-integration-state
) {
  border-radius: var(--vetka-radius-control);
}

:is(.integration-state-panel, .reg-access-state, .confirm-integration-state)[data-state='ready'] {
  border-color: var(--vetka-ready-border);
}

:is(.integration-state-panel, .reg-access-state, .confirm-integration-state)[data-state='pending'] {
  border-color: var(--vetka-pending-border);
}

@media (prefers-reduced-motion: reduce) {
  :is(.auth-flow-page, .profile-page) *,
  :is(.auth-flow-page, .profile-page) *::before,
  :is(.auth-flow-page, .profile-page) *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
  }
}
