/* =========================================================
   TaleKin Lab — Unified Button Styles
   白与深墨建立操作层级；黄色只用于焦点，语义色只用于状态操作。
   本文件只统一颜色、边框与状态，不改各页面的业务行为和尺寸。
   ========================================================= */

:is(
  .btn, .btn-secondary, .btn-outline, .btn-back, .team-action,
  .age-btn, .btn-sm, .btn-analysis, .btn-cancel, .btn-logout,
  .c-btn, .c-btn-cancel, .btn-record, .btn-add, .btn-rec
) {
  border-radius: var(--lab-radius-sm, 8px);
  border-color: var(--lab-border, rgba(39, 35, 67, 0.16));
  color: var(--lab-ink, #272343);
  background: var(--lab-bg, #fffffe);
  box-shadow: none;
  transition: background 140ms ease, color 140ms ease, border-color 140ms ease,
    transform 80ms ease, opacity 140ms ease;
  -webkit-tap-highlight-color: transparent;
}

:is(
  .btn, .btn-secondary, .btn-outline, .btn-back, .team-action,
  .age-btn, .btn-sm, .btn-analysis, .btn-cancel, .btn-logout,
  .c-btn, .c-btn-cancel, .btn-record, .btn-add, .btn-rec
):hover:not(:disabled) {
  border-color: var(--lab-ink, #272343);
  color: var(--lab-ink, #272343);
  background: var(--lab-surface-subtle, #f7f7f9);
}

:is(
  .btn, .btn-secondary, .btn-outline, .btn-back, .team-action,
  .age-btn, .btn-sm, .btn-analysis, .btn-cancel, .btn-logout,
  .c-btn, .c-btn-cancel, .btn-record, .btn-add, .btn-rec
):active:not(:disabled) {
  transform: translateY(1px);
}

/* 主操作：深墨色承担视觉重量，不再铺满黄色。 */
:is(
  .btn.primary, .btn-primary, .btn-sm.primary, .btn-generate,
  .btn-submit, .btn-nav, .btn-action, .btn-save, .btn-add
) {
  border-color: var(--lab-ink, #272343);
  color: var(--lab-bg, #fffffe);
  background: var(--lab-ink, #272343);
  box-shadow: inset 0 -2px 0 var(--lab-action, #ffd803);
}

:is(
  .btn.primary, .btn-primary, .btn-sm.primary, .btn-generate,
  .btn-submit, .btn-nav, .btn-action, .btn-save, .btn-add
):hover:not(:disabled) {
  border-color: var(--lab-text, #2d334a);
  color: var(--lab-bg, #fffffe);
  background: var(--lab-text, #2d334a);
}

/* 危险操作默认克制，悬停才填充；确认弹窗仍使用实心危险色。 */
:is(.btn.danger, .btn-danger, .btn-sm.danger, .btn-rec.start, .c-btn-danger) {
  border-color: var(--lab-danger, #b3365a);
  color: var(--lab-danger, #b3365a);
  background: var(--lab-bg, #fffffe);
  box-shadow: none;
}

:is(.btn.danger, .btn-danger, .btn-sm.danger, .btn-rec.start, .c-btn-danger):hover:not(:disabled) {
  border-color: var(--lab-danger, #b3365a);
  color: var(--lab-ink, #272343);
  background: var(--lab-danger-fill, #ff8ba7);
}

:is(.btn.success, .btn-success, .btn-sm.success, .btn-done) {
  border-color: var(--lab-success, #1f7a55);
  color: var(--lab-success, #1f7a55);
  background: var(--lab-bg, #fffffe);
  box-shadow: none;
}

:is(.btn.success, .btn-success, .btn-sm.success, .btn-done):hover:not(:disabled) {
  border-color: var(--lab-success, #1f7a55);
  color: var(--lab-bg, #fffffe);
  background: var(--lab-success, #1f7a55);
}

:is(
  .btn, .btn-primary, .btn-secondary, .btn-danger, .btn-success,
  .btn-generate, .btn-submit, .btn-nav, .btn-action, .btn-analysis,
  .btn-back, .team-action, .btn-outline, .age-btn, .btn-sm,
  .btn-rec, .c-btn-danger, .btn-done, .c-btn, .c-btn-cancel,
  .btn-record, .btn-add, .btn-save, .btn-cancel, .btn-logout
):disabled {
  border-color: var(--lab-border, rgba(39, 35, 67, 0.16));
  color: var(--lab-text-muted, rgba(45, 51, 74, 0.72));
  background: var(--lab-surface-muted, #efeff3);
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.68;
  transform: none;
}

:is(
  .btn, .btn-primary, .btn-secondary, .btn-danger, .btn-success,
  .btn-generate, .btn-submit, .btn-nav, .btn-action, .btn-analysis,
  .btn-back, .team-action, .btn-outline, .age-btn, .btn-sm,
  .btn-rec, .c-btn-danger, .btn-done, .c-btn, .c-btn-cancel,
  .btn-record, .btn-add, .btn-save, .btn-cancel, .btn-logout
):focus-visible {
  outline: 2px solid var(--lab-ink, #272343);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px var(--lab-action, #ffd803);
}

.age-btn.selected,
.age-btn.selected:hover:not(:disabled),
.btn-rec.stop,
.btn-rec.stop:hover:not(:disabled) {
  border-color: var(--lab-ink, #272343);
  color: var(--lab-bg, #fffffe);
  background: var(--lab-ink, #272343);
}