/* базовые компоненты дизайн-системы AURA: только переменные из styles/tokens.css, веса 400/600/700 */
.ui-btn, .ui-icon-btn, .ui-seg__item, .ui-theme, .ui-chip__x {
  font-family: var(--font-ui); cursor: pointer;
  transition: background var(--motion), border-color var(--motion), color var(--motion);
}
.ui-btn:focus-visible, .ui-icon-btn:focus-visible, .ui-seg__item:focus-visible, .ui-theme:focus-visible, .ui-chip__x:focus-visible {
  outline: 2px solid var(--color-focus-ring); outline-offset: 2px;
}
.ui-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  height: var(--control-h); padding: 0 var(--space-4); border: 1px solid transparent; border-radius: var(--radius-round);
  font-size: var(--fs-body); line-height: var(--lh-body); font-weight: 600; white-space: nowrap;
}
.ui-btn--lg { height: var(--control-h-lg); padding: 0 var(--space-5); }
.ui-btn--primary { background: var(--color-action-primary); color: var(--color-text-on-primary); }
.ui-btn--primary:hover:not(:disabled) { background: var(--color-action-primary-hover); }
.ui-btn--secondary { background: transparent; border-color: var(--color-border-strong); color: var(--color-text-primary); }
.ui-btn--secondary:hover:not(:disabled) { border-color: var(--color-action-primary); }
.ui-btn--secondary[aria-pressed="true"] {
  background: var(--color-bg-selected); border-color: var(--color-action-primary); color: var(--color-action-primary);
}
.ui-btn--danger { background: var(--color-action-danger); color: var(--color-text-on-primary); }
.ui-btn--danger:hover:not(:disabled) { background: var(--color-action-danger-hover); }
.ui-btn--ghost { background: transparent; color: var(--color-action-primary); }
.ui-btn--ghost:hover:not(:disabled) { background: var(--color-bg-hover); color: var(--color-action-primary-hover); }
.ui-btn:disabled { cursor: not-allowed; color: var(--color-text-disabled); }
.ui-btn--primary:disabled, .ui-btn--danger:disabled { background: var(--color-bg-track); border-color: var(--color-border-default); }
.ui-btn[aria-busy="true"] { cursor: progress; }
.ui-spinner {
  width: 16px; height: 16px; border-radius: var(--radius-round);
  border: 2px solid var(--color-border-strong); border-top-color: var(--color-action-primary);
  animation: ui-spin 800ms linear infinite;
}
@keyframes ui-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .ui-spinner { animation-duration: 2400ms; } }

.ui-icon-btn {
  display: inline-flex; align-items: center; justify-content: center; width: var(--control-h); height: var(--control-h);
  padding: 0; border: 1px solid transparent; border-radius: var(--control-radius); background: transparent; color: var(--color-text-secondary);
}
.ui-icon-btn:hover:not(:disabled) { background: var(--color-bg-hover); border-color: var(--color-border-strong); color: var(--color-text-primary); }
.ui-icon-btn:disabled { cursor: not-allowed; color: var(--color-text-disabled); }

.ui-seg {
  display: inline-flex; gap: var(--space-1); padding: var(--space-1); border-radius: var(--radius-round); background: var(--color-bg-track);
}
.ui-seg__item {
  display: inline-flex; align-items: center; height: 24px; padding: 0 var(--space-4); border: 1px solid transparent;
  border-radius: var(--radius-round); background: transparent; color: var(--color-text-secondary);
  font-size: var(--fs-body); line-height: var(--lh-body); font-weight: 400; text-decoration: none; white-space: nowrap;
}
.ui-seg__item:hover { color: var(--color-text-primary); }
.ui-seg__item[aria-checked="true"], .ui-seg__item[aria-current="page"] {
  background: var(--color-bg-surface); border-color: var(--color-border-selected); color: var(--color-action-primary); font-weight: 600;
}

.ui-theme {
  display: inline-flex; align-items: center; width: 44px; height: 24px; padding: 2px; border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-round); background: var(--color-bg-track); color: var(--color-text-secondary);
}
.ui-theme__knob {
  display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: var(--radius-round);
  background: var(--color-bg-surface); box-shadow: inset 0 0 0 1px var(--color-border-default); transition: transform var(--motion);
}
.ui-theme[aria-checked="true"] { border-color: var(--color-border-selected); color: var(--color-action-primary); }
.ui-theme[aria-checked="true"] .ui-theme__knob { transform: translateX(20px); }

.ui-badge {
  display: inline-flex; align-items: center; height: 20px; padding: 0 var(--space-2); border: 1px solid transparent;
  border-radius: var(--radius-round); font-size: var(--fs-caption); line-height: var(--lh-caption); font-weight: 600; white-space: nowrap;
}
.ui-badge--neutral { background: var(--color-bg-track); border-color: var(--color-border-default); color: var(--color-text-secondary); }
.ui-badge--success { background: var(--color-status-success-bg); border-color: var(--color-status-success); color: var(--color-status-success); }
.ui-badge--error { background: var(--color-status-error-bg); border-color: var(--color-status-error); color: var(--color-status-error); }
.ui-badge--warning { background: var(--color-status-warning-bg); border-color: var(--color-status-warning-border); color: var(--color-status-warning); }
.ui-badge--info { background: var(--color-bg-subtle); border-color: var(--color-border-strong); color: var(--color-text-primary); }

.ui-chip {
  display: inline-flex; align-items: center; gap: var(--space-1); height: 24px; padding: 0 var(--space-1) 0 var(--space-3);
  border: 1px solid var(--color-border-selected); border-radius: var(--radius-round); background: var(--color-bg-selected);
  color: var(--color-action-primary); font-size: var(--fs-caption); line-height: var(--lh-caption); font-weight: 600;
}
.ui-chip__x {
  display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; padding: 0; border: 0;
  border-radius: var(--radius-round); background: transparent; color: inherit;
}
.ui-chip__x:hover { background: var(--color-bg-hover); }

.ui-notice {
  display: flex; align-items: flex-start; gap: var(--space-3); padding: var(--space-3) var(--space-4);
  border: 1px solid var(--color-border-default); border-radius: var(--radius-lg); background: var(--color-bg-subtle);
}
.ui-notice__icon {
  display: inline-flex; flex: none; align-items: center; justify-content: center; width: 20px; height: 20px;
  border-radius: var(--radius-round); color: var(--color-text-on-primary); background: var(--color-text-secondary);
}
.ui-notice__body { flex: 1; min-width: 0; }
.ui-notice__title { font-size: var(--fs-body); line-height: var(--lh-body); font-weight: 600; color: var(--color-text-primary); }
.ui-notice__text { font-size: var(--fs-caption); line-height: var(--lh-caption); color: var(--color-text-secondary); }
.ui-notice__action { flex: none; }
.ui-notice--success { background: var(--color-status-success-bg); border-color: var(--color-status-success); }
.ui-notice--success .ui-notice__icon { background: var(--color-status-success); }
.ui-notice--error { background: var(--color-status-error-bg); border-color: var(--color-status-error); }
.ui-notice--error .ui-notice__icon { background: var(--color-status-error); }
.ui-notice--warning { background: var(--color-status-warning-bg); border-color: var(--color-status-warning-border); }
.ui-notice--warning .ui-notice__icon { background: var(--color-status-warning); }

.ui-panel {
  background: var(--color-bg-surface); border: 1px solid var(--color-border-default); border-radius: var(--radius-xl);
}
.ui-panel--md { padding: var(--space-4); }
.ui-panel--lg { padding: var(--space-6); }
.ui-panel--none { padding: 0; }

.ui-page-header { display: flex; flex-direction: column; gap: var(--space-4); margin-bottom: var(--space-4); }
.ui-page-header__row { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--space-4); }
.ui-page-header__text { min-width: 0; }
.ui-page-header__title { margin: 0; font-size: var(--fs-section); line-height: var(--lh-section); font-weight: 700; color: var(--color-text-primary); }
.ui-page-header__subtitle { margin: var(--space-1) 0 0; font-size: var(--fs-body); line-height: var(--lh-body); color: var(--color-text-secondary); }
.ui-page-header__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }

/* поля */
.ui-field { display: flex; flex-direction: column; gap: var(--space-1); }
.ui-field__label { font-size: var(--fs-body); line-height: var(--lh-body); font-weight: 600; color: var(--color-text-primary); }
.ui-field__hint { font-size: var(--fs-caption); line-height: var(--lh-caption); color: var(--color-text-secondary); }
.ui-field__error { font-size: var(--fs-caption); line-height: var(--lh-caption); color: var(--color-status-error); }

.ui-input {
  box-sizing: border-box; width: 100%; height: var(--control-h); padding: 0 var(--space-3);
  border: 1px solid var(--color-border-default); border-radius: var(--control-radius);
  background: var(--color-bg-surface); color: var(--color-text-primary);
  font: inherit; font-family: var(--font-ui); font-size: var(--fs-body); line-height: var(--lh-body);
  transition: border-color var(--motion), box-shadow var(--motion);
}
.ui-input--lg { height: var(--control-h-lg); }
.ui-input::placeholder { color: var(--color-text-placeholder); }
.ui-input:hover:not(:disabled) { border-color: var(--color-border-strong); }
.ui-input:focus-visible { outline: 2px solid var(--color-focus-ring); outline-offset: 2px; border-color: var(--color-action-primary); }
.ui-input[aria-invalid="true"] { border-color: var(--color-status-error); }
.ui-input:disabled { cursor: not-allowed; color: var(--color-text-disabled); background: var(--color-bg-track); }
.ui-textarea { height: auto; min-height: 80px; padding: var(--space-2) var(--space-3); resize: vertical; }

.ui-search { position: relative; display: inline-flex; align-items: center; width: 100%; }
.ui-search__icon { position: absolute; left: var(--space-3); display: inline-flex; color: var(--color-text-secondary); pointer-events: none; }
.ui-search__input { padding-left: calc(var(--space-3) + 24px); padding-right: calc(var(--space-2) + var(--control-h)); }
.ui-search__input::-webkit-search-cancel-button { display: none; }
.ui-search__clear { position: absolute; right: 0; }

.ui-select { position: relative; display: inline-flex; align-items: center; width: 100%; }
.ui-select__control { appearance: none; padding-right: calc(var(--space-3) + 24px); cursor: pointer; }
.ui-select--lg .ui-select__control { height: var(--control-h-lg); }
.ui-select__chevron { position: absolute; right: var(--space-3); display: inline-flex; color: var(--color-text-secondary); pointer-events: none; }

.ui-check { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--fs-body); line-height: var(--lh-body); color: var(--color-text-primary); cursor: pointer; }
.ui-check__box { width: 16px; height: 16px; margin: 0; border-radius: var(--radius-xs); accent-color: var(--color-action-primary); cursor: pointer; }
.ui-check__box:focus-visible { outline: 2px solid var(--color-focus-ring); outline-offset: 2px; }

/* окно */
.ui-dialog {
  box-sizing: border-box; max-width: none; max-height: 90vh; padding: var(--space-6); overflow: auto;
  border: 1px solid var(--color-border-default); border-radius: var(--radius-2xl);
  background: var(--color-bg-surface); color: var(--color-text-primary); box-shadow: var(--shadow-dialog);
  font-family: var(--font-ui);
}
.ui-dialog::backdrop { background: var(--color-overlay); }
.ui-dialog--sm { width: min(480px, calc(100vw - 32px)); }
.ui-dialog--md { width: min(640px, calc(100vw - 32px)); }
.ui-dialog--lg { width: min(1000px, calc(100vw - 32px)); }
@media (max-width: 700px) {
  .ui-dialog { width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; margin: 0; border-radius: 0; }
}

/* меню: пункты — кнопки; «выбрано» — цветом текста и галочкой */
.dd-menu {
  background: var(--color-bg-surface); border: 1px solid var(--color-border-default); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-popover); color: var(--color-text-primary); font-family: var(--font-ui);
}
.dd--start > .dd-menu.menu { left: 0; right: auto; }
.menu button {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); width: 100%;
  min-height: var(--control-h); padding: var(--space-1) var(--space-3); border: 0; border-radius: var(--radius-sm);
  background: none; color: var(--color-text-primary); font: inherit; font-family: var(--font-ui);
  font-size: var(--fs-body); line-height: var(--lh-body); text-align: left; cursor: pointer;
  transition: background var(--motion), color var(--motion);
}
.menu button:hover { background: var(--color-bg-hover); }
.menu button:focus-visible { outline: 2px solid var(--color-focus-ring); outline-offset: -2px; background: var(--color-bg-hover); }
.menu button[aria-pressed="true"] { color: var(--color-action-primary); }
.menu button[aria-pressed="true"]::after { content: "✓"; font-weight: 600; }
.menu button.danger { color: var(--color-status-error); }
.menu hr { border: 0; border-top: 1px solid var(--color-border-default); margin: var(--space-1) 0; }