
  .nav_button_wrap {
    --nav_button_thickness: 0.0625rem;
    --nav_button_gap: 0.25rem;
    --nav_button_rotate: 45;
  }
  [data-nav-status='open'] .nav_button_line,
  .nav_wrapper:has(.is-open) .nav_button_line {
    transform: scaleX(0);
  }
  [data-nav-status='open'] .nav_button_line:first-child,
  .nav_wrapper:has(.is-open) .nav_button_line:first-child {
    transform: translateY(calc(var(--nav_button_thickness) * 1 + var(--nav_button_gap) * 1)) rotate(calc(var(--nav_button_rotate) * -1deg));
  }
  [data-nav-status='open'] .nav_button_line:last-child,
  .nav_wrapper:has(.is-open) .nav_button_line:last-child {
    transform: translateY(calc(var(--nav_button_thickness) * -1 + var(--nav_button_gap) * -1)) rotate(calc(var(--nav_button_rotate) * 1deg));
  }
