/* KOIREA Button Design System tokens.
 * This is the only source for button color, type, radius, depth and motion values.
 */
:root {
  --button-primary-border: #fb3d72;
  --button-primary-start: #fb4b7d;
  --button-primary-center: #fc2765;
  --button-primary-end: #fb618b;
  --button-primary-text: #fff;
  --button-secondary-border: #f6698a;
  --button-secondary-text: #13243a;
  --button-secondary-surface: #ffffff;
  --button-tertiary-text: #dc2557;
  --button-emotional-border: #f785a3;
  --button-emotional-selected-border: #f59ab2;
  --button-emotional-selected-text: #d82355;
  --button-neutral-bg: #fffafb;
  --button-neutral-border: #f69ab1;
  --button-neutral-text: #13243a;
  --button-disabled-bg: #e6e6e5;
  --button-disabled-border: #e6e6e5;
  --button-disabled-text: #675f62;
  --button-danger: #a61b2b;
  --button-danger-border: #df4256;
  --button-danger-text: #c9283f;
  --button-danger-hover: #8f1725;
  --button-danger-active: #77131f;
  --button-danger-subtle: #fff2f3;
  --button-height-default: 48px;
  --button-height-compact: 44px;
  --button-height-touch: 50px;
  --button-radius-default: 999px;
  --button-radius-soft: 18px;
  --button-padding-x: 22px;
  --button-icon-size: 20px;
  --button-icon-gap: 10px;
  --button-font-size: 15px;
  --button-font-weight: 800;
  --button-shadow-subtle: inset 0 1px 0 #fff, 0 5px 14px rgba(74, 33, 47, .07);
  --button-shadow-neutral: inset 0 1px 0 #fff, 0 5px 14px rgba(74, 33, 47, .06);
  --button-shadow-primary: inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -1px 0 rgba(137, 13, 52, .10), 0 9px 22px rgba(244, 43, 98, .20);
  --button-shadow-elevated: inset 0 1px 0 rgba(255, 255, 255, .30), inset 0 -1px 0 rgba(137, 13, 52, .10), 0 13px 30px rgba(244, 43, 98, .27);
  --button-focus-ring: 0 0 0 3px var(--brand-primary-focus);
  --button-transition: background-color .16s ease, background-image .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .12s ease;
}